在平常开发过程中，要是没有特定要求，可以采用下面的方式 1自适应网页设计，即响应式布局 2不使用绝对宽度 由于网页会根据屏幕宽度调整布局，所以不能使用绝对宽度的布局，也不能使用具有绝对宽度的元素3相对大小的字体 字体也不能使用绝对大小px，而只能使用相对大小em4流动布局fluid grid。

实现自适应布局例如，为宽度小于480px的页面设置特定样式，以确保内容在不同设备上都能良好展示此外，对于没有编程基础的用户，可以考虑使用免编程工具来制作自适应网站，这些工具通常通过拖拽操作即可生成自适应的HTML5页面。

头部要加的是这个，放在ltheadlthead标签里，这是初始化手机屏幕的ltmeta name=quotviewportquot content=quotwidth=devicewidth， initialscale=10， maximumscale=10， userscalable=noquot 你写的这段是要放在所有css样式后边的，以防止样式覆盖这段的意思是在电脑屏或者其他屏上你显示的是一个。

使用百分比和rem替换px，代码效果对比*使用固定像素* box float left width 658px fontsize 72px textalign center lineheight 195px *使用百分比和rem* box float left width 6093% fontsize 171rem textalign center lineheight 464。

自适应网站是一种利用HTML5技术，通过检测屏幕尺寸自动调整布局的设计方式，也被称为响应式设计它的核心特点是，无论在PC手机还是IPAD上，只需一套代码就能实现无缝适应，无需单独为每个平台开发，大大简化了维护工作这种设计对搜索引擎特别友好，特别是对百度为了明确告知百度页面的自适应特性，可以。

方法一使用background属性创建HTML文件新建一个HTML文件，并添加基本的HTML结构添加CSS样式在HTML文件中或通过外部CSS文件，为包含图片的容器设置样式使用backgroundimage属性设置图片使用backgroundsize cover确保图片覆盖整个容器，并根据容器大小自适应可以设置width 100%和height auto使。