66. CSS3 Responsive布局技巧

通过上面的介绍,大家对响应式设计有了一定的了解,但在实际制作中还是有一些布局技巧的:

在Responsive布局中,可以毫无保留的丢弃:

  1. 尽量少用无关紧要的div;
  2. 不要使用内联元素(inline);
  3. 尽量少用JS或flash;
  4. 丢弃没用的绝对定位和浮动样式;
  5. 摒弃任何冗余结构和不使用100%设置。

有舍才有得,丢弃了一些对Responsive有影响的东东,那么有哪些东东能帮助Responsive确定更好的布局呢?

  1. 使用HTML5 Doctype和相关指南;
  2. 重置好你的样式(reset.css);
  3. 一个简单的有语义的核心布局;
  4. 给重要的网页元素使用简单的技巧,比如导航菜单之类元素。

使用这些技巧,无非是为了保持你的HTML简单干净,而且在你的页面布局中的关键部分(元素)不要过分的依赖现代技巧来实现,比如说CSS3特效或者JS脚本。

说了这么多,怎么样的布局或者说HTML结构才是简单干净的呢?这里教大家一个快速测试的方法。你首先禁掉你页面中所有的样式(以及与样式相关的信息),在浏览器中打开,如果你的内容排列有序,方便阅读,那么你的这个结构不会差到哪里去。

「点点赞赏,手留余香」

0

给作者打赏,鼓励TA抓紧创作!

微信微信 支付宝支付宝

还没有人赞赏,快来当第一个赞赏的人吧!

声明:本站所有资源及文章均来源于网络及用户分享或为本站原创,仅限用于学习和研究,任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
码云笔记 » 66. CSS3 Responsive布局技巧

发表评论

IT互联网行业相关广告投放 更专业 更精准

立即查看 联系我们