然而,不用框架,怎么做到自适应呢?

菜鸟的蜕变之路
浏览 1644回答 4
4回答

blovetu

首先,在<head>里加入一行viewport元标 签。<meta name=”viewport”content=”width=device-width, initial-scale=1″ />viewport是网页默认的宽度和高度,上面这行代码的意思是,网页宽度默认等于屏幕宽度(width=device-width),原始缩 放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。“自适应网页设计”的核心,就是CSS3引入的Media Query模块。它的意思就是,自动探测屏幕宽度,然后加载相应的CSS文件。同一个CSS文件中,也可以根据不同的屏幕分辨率,选择应用不同的CSS规则。   其次,除了布局和文本,”自适应网页设计”还必须实现图片的自动缩放。有条件的话,最好还是根据不同大小的屏幕,加载不同分辨率的图片。有很多方法可以做到这一条,服务器端和客户端都可以实现。

刚毅87

在设置宽度和高度时,不要使用固定值,使用百分比,百分比值为父级宽度或高度的百分之几.

慕函数0883431

思路大概就是meta 标签可以设置 minwidth maxwidth 还有设置文档中各个标签的宽度的时候,不要定死,用相对宽度 %  百分制
打开App,查看更多内容
随时随地看视频慕课网APP