HTML5写网站遇到问题总结与思考1

编写网站第一件事

创建站点文件夹（可以是中文），但其下的子文件夹和子文件不能是中文。

一、文字颜色在li中已经设置但却是蓝色

原因：1.li中文字颜色默认是蓝色

2.li里面的文字颜色大小等属性需要在li>a里面设置才会生效

二、操作过程中的快捷键

Ctrl+Shift+/注释

Cmd+D 在某一行操作，会复制与本行同样的内容到下一行

三、疑问：margin-left与padding-left的区别？

margin边界 padding填充

四、 优化.header_nav_left和right里的文字变换逻辑一样，优化时粗心导致问题：本应该在黑色区域内显示的内容却超出父级的高度脱离文档显示了

原因： .header_nav_right本不应该设置左边界margin-left：40却设置了，导航图片和注册按钮位置布局偏移错乱左边界设置太大，而整个.header_nav_right的宽度不够就会导致显示自动换行了。

五、请教大佬学到的：父级高度塌陷 BFC

产生因素：1.父级元素没设置高度 2.子元素有高度 3.子元素设置了浮动

正常情况是父元素高度默认被子元素撑开，而子元素设置浮动后，父元素的高度会变成0，父元素同级别的下面的元素会上移从而导致布局错乱

解决办法：1.父元素结束前加clear: both;缺点：增加了无意义标签

2.父元素overflow:hidden; zoom:1; 缺点：若子元素margin是负或负绝对定位，会被裁掉

3.父元素float:left;缺点：导致父元素宽度丢失，与父元素相邻的元素布局受影响且下面的元素上移

4.display:line-block;缺点：导致父元素宽度丢失，

5.:after伪类+设置zoom:1;（触发IE6/7的haslayout）最推荐的方法

利用伪类清除浮动，与空div并设置clear: both效果一样，但是有优点：代替了空的div，不会影响其他样式。通用性强，覆盖面广

.类名:after{

content:".",/生成内容为最好一个元素/

display:block;块级元素显示，占满空间

height:0;避免生成的内容破坏原有的高度

clear: both;闭合浮动

visibility：hidden；使生成内容不可见并允许可生成内容盖住的内容点击和交互}

标题六、清空默认边距

6.1为什么要清空默认的内外边距？

在企业开发中为了更好的控制盒子的宽高和计算盒子的宽高等等, 所以在企业开发中, 编写代码之前第一件事情就是清空默认的边距

6.2如何清空边距？实际使用中如何使用

*{ margin: 0;
padding: 0;}
通配符选择器会找到(遍历)当前界面中所有的标签, 所以性能不好
企业开发中可以从这个网址中拷贝http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css