响应式Web设计:HTML5和CSS3实战

html5改变了什么?

1.语义化标签,原有的依靠div、span标签+类名的方式被各式的html5标签取代

<header></header>

<section><article></article></section>

<nav></nav>

<aside></aside>

<footer><footer>

2.引入媒体标签

<video></video>

<audio></audio>

3.简化html头部标签

css3改变了什么

1.响应式设计,原因是媒体查询的引入,css可以根据客户端的显示情况设定合适的显示策略

2.固定布局转换成流式百分比布局,变更公式:

百分比=父级原有固定宽度/元素原有固定宽度

宽度的相关值应转换成百分比宽度,比如:

margin-left,padding-left,width,left

高度的相关值、边框仍保留固定px

height,border

字体改为em单位

font-size:1em  //1em默认为16px,依然使用百分比大小

浏览器适配方案

渐进增强与优雅降级,最佳实践是以移动端为标准方案,针对老旧浏览器使用增强脚本。

微盘下载:响应式Web设计:HTML5和CSS3实战

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容