静态页面规划要点

1.分析设计图

盒子嵌套关系

2.CSS初始化

清除默认样式
输入默认字体颜色 大小

3.Html书写

合理布局
规划版心

有通栏时通栏作为父容器，不设置宽度，直接继承body宽度，版心嵌套于通栏之内 ，内容嵌套于版心
无通栏时版心作为父容器，内容嵌套于版心之内

页面结构
header main footer
注释
定义类名

4.CSS书写

自上而下
浮动
清除浮动
定位
CSS精灵
滑动门
伸缩盒子

5.捕捉bug

Chrome开发工具使用
代码规范性

电脑触摸板禁用
选择器书写
标点英文格式
标签直接写
类名加点
ID加#
伪类冒号
伪元素双冒号 content属性必写
图片路径
样式路径

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • HTML+CSS(47-72)
    问答题47 /72 常见浏览器兼容性问题与解决方案？ 参考答案 (1)浏览器兼容问题一：不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1赞 92
  • CSS
    display: none; 与 visibility: hidden; 的区别 联系：它们都能让元素不可见 区别...
    纹小艾阅读 1,661评论 0赞 1
  • CSS学习笔记
    1.CSS基本概念 1.1 CSS的定义 CSS(Cascading Style Sheets)层叠样式表，主要用...
    寥寥十一阅读 1,874评论 0赞 6
  • 前端面试题整理
    在线阅读 http://interview.poetries.top[http://interview.poetr...
    前端进阶之旅阅读 114,791评论 24赞 450
  • SYX-10-111
    静思微笑阅读 208评论 0赞 0