超实用的css代码-23948面试.docxVIP

CSS面试题答案Doctype作用是什么？严格模式与混杂模式分别是如何触发这两种模式的，区分它们有何意义？（1）!DOCTYPE 声明位于文档中的最前面，处于html标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。（2）严格模式的排版和JavaScript运作模式是以该浏览器支持的最高标准运行。（3）在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。（4）DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。行内元素有哪些？块级元素有哪些？空(void)元素有哪些？（1）CSS规范规定，每个元素都有display属性，确定该元素的类型，每个元素都有默认的display值，比如div默认display属性值为“block”，称为“块级”元素；span默认display属性值为“inline”，是“行内”元素。（2）行内元素有：a b span img input select strong（强调的语气）块级元素有：div ulol li dl dtdd h1 h2 h3 h4…p（3）知名的空元素： br hr img input link meta 鲜为人知的是： area base col command embed keygen param source track wbr如何理解CSS的盒子模型？每个HTML元素都是长方形盒子。（1）盒子模型有两种，IE盒子模型、标准W3C盒子模型；IE的content部分包含了border和pading。（2）盒模型包含：内容(content)、填充(padding)、边界(margin)、边框(border)。link和@import的区别是？（1）link属于XHTML标签，而@import是CSS提供的。（2）页面被加载时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载。（3）import只在IE 5以上才能识别，而link是XHTML标签，无兼容问题。（4）link方式的样式权重高于@import的权重。CSS 选择符有哪些？哪些属性可以继承？优先级算法如何计算？CSS 3新增伪类有哪些？id选择器（# myid）类选择器（.myclassname）标签选择器（div、h1、p）相邻选择器（h1 + p）子选择器（ul li）后代选择器（li a）通配符选择器（ * ）属性选择器（a[rel = external]）伪类选择器（a: hover, li: nth - child）可继承： font-size font-family color, UL LI DL DD DT;不可继承：border padding margin width height ;优先级就近原则，样式定义最近者为准，载入样式以最后载入的定位为准。优先级为： !important id class tag important 比内联优先级高CSS3新增伪类举例：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 单选框或复选框被选中。如何居中div，如何居中一个浮动元素？（1）给div设置一个宽度，然后添加margin:0 auto属性div{width:200px;margin:0 auto; } （2）居中一个浮动元素确定容器的宽高，如宽500、高 300的层，设置层的外边距： .div { Width:500px ; height:300px;//高度可以不设 Margin: -150px 0 0 -250px;position:relative;相对定位background-color:pink;//方便看效果left:50%;top:50%; } 浏览器的内核分别是什么？经常遇到的浏览器的兼容性有哪些？原因、解决方法是什么，常用Hack的技巧有哪些？（1）IE浏览器的内核Trident、Mozilla的Gecko、Google的WebKit、Opera内核Presto；（2）经常遇到的浏览器的兼容性：png24为的图片在IE6浏览器上出现背景，解决方案是做成PNG8。浏览器默认的margin和padding不同，解决方案是加