20170212am htm

1、为什么重置浏览器默认样式。如何重置。

为什么：每个浏览器默认样式都不同，存在兼容问题。故须重置

如何：用CssReset

注：不用* {padding:0;margin:0}，而是html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre{padding:0;margin:0}的原因：1、简单粗暴的覆盖了默认的还不错的样式。2、且优先级最低，无法改变id、class里的margin padding。

2、如何使页面元素隐藏。

1、display:none;不占据页面位置（css），被屏幕阅读器忽略。

2、visibility:hidden;占据页面位置(css)

3、hidden="hidden";不占据页面位置（h5新的）<p hidden>该段被隐藏</p>

4、overflow:hidden,height:o;width:0;不仅不占据页面物理位置，且可使得屏幕阅读器不忽略。

3、内联与块级标签的区别。

内联不换行。宽高不可设。可设水平方向的margin pading，即margin-left margin-right padding-right padding-left。垂直方向的不可设。input a img span

块级换行。可设宽高。但宽度设置完依然是独占一行。div p h1 ul li

将二者变为内联的，既可以设置宽高又在一行。

.span{display:inline-block};

div{display:inline-block};

上述方法块级元素（内联元素兼容）在ie浏览器中不兼容，故用下边的方法：

div{display:inline-block};

div{display:inline};

4、边距折叠。解决。

两个或多个毗邻的正常流的块元素垂直方向的margin会折叠。

解决：

并列的：二者设为同一方向的，如都为margin-top或margin-bottom

父子关系：给父元素加上overflow:hidden;

或给父元素加上边框：border:1px solid transparent

5、怪异模式和标准模式的区别。

1、布局。怪异模式宽高包括padding和border。标准模式宽高即为content宽高

2、标准模式给行内元素设置宽高则不会生效，而怪异模式会生效。