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、标准模式给行内元素设置宽高则不会生效,而怪异模式会生效。