一：display:none和visibility:hidden的区别？
display:none 隐藏对应的元素，在文档布局中不再给它分配空间，它各边的元素会合拢，就当他从来不存在。
visibility:hidden 隐藏对应的元素，但是在文档布局中仍保留原来的空间。
二：CSS中link和@import的区别是？
(1)link属于HTML标签，而@import是CSS提供的
(2) 页面被加载的时，link会同时被加载，而@import被引用的CSS会等到引用它的CSS文件被加载完再加载
(3)import只在IE5以上才能识别，而link是HTML标签，无兼容问题
(4)link方式的样式的权重 高于@import的权重
三：position:absolute和float属性的异同
共同点：对内联元素设置float和absolute属性，可以让元素脱离文档流，并且可以设置其宽高。
不同点：float仍会占据位置，absolute会覆盖文档流中的其他元素。
四：box-sizing属性？
box-sizing属性主要用来控制元素的盒模型的解析模式。默认值是content-box。
content-box：让元素维持W3C的标准盒模型。元素的宽度/高度由border + padding + content的宽度/高度决定，设置width/height属性指的是content部分的宽/高
border-box：让元素维持IE传统盒模型（IE6以下版本和IE6~7的怪异模式）。设置width/height属性指的是border + padding + content
标准浏览器下，按照W3C规范对盒模型解析，一旦修改了元素的边框或内距，就会影响元素的盒子尺寸，就不得不重新计算元素的盒子尺寸，从而影响整个页面的布局。
五：CSS新增伪类举例：
p:first-of-type选择属于其父元素的首个<p>元素的每个
<p>元素。
p:last-of-type选择属于其父元素的最后<p>元素的每个<p>元素。
p:only-of-type选择属于其父元素唯一的<p>元素的每个<p>元素。
p:only-child 选择属于其父元素的唯一子元素的每个<p>元素。
p:nth-child(2) 选择属于其父元素的第二个子元素的每个<p>元素。
:enabled :disabled 控制表单控件的禁用状态。
:checked 单选框或复选框被选中
六：说说你对语义化的理解？
1，去掉或者丢失样式的时候能够让页面呈现出清晰的结构
2，有利于SEO：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重；
3，方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以意义的方式来渲染网页；
4，便于团队开发和维护，语义化更具可读性，是下一步吧网页的重要动向，遵循W3C标准的团队都遵循这个标准，可以减少差异化。
Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
1）、声明位于文档中的最前面，处于标签之前。告知浏览器以何种模式来渲染文档。
2）、严格模式的排版和JS运作模式是 以该浏览器支持的最高标准运行。
3）、在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
4）、DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。
Doctype文档类型？
该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。
HTML4.01规定了三种文档类型：Strict、Transitional 以及 Frameset。 XHTML1.0规定了三种XML文档类型：Strict、Transitional 以及 Frameset。Standards （标准）模式（也就是严格呈现模式）用于呈现遵循最新标准的网页， Quirks （包容）模式（也就是松散呈现模式或者兼容模式）用于呈现为传统浏览器而设计的网页。
网友评论