前端面试题------HTML/CSS

1、position：absolute和float属性的异同

     共同点：对内联元素设置float和absolute属性，可以让元素脱离文档流，并且可以设置其宽高。

     不同点：float仍会占据位置，position会覆盖文档流中的其他元素。

2、CSS选择器有哪些？

     id选择器（#）

     类选择器（.）

     元素选择器（div）

     通配符选择器（*）

     后代选择器（li a）

     伪类选择器（：hover ：nth:child(从1开始)）

     属性选择器（a[rel = "external"]）

     子选择器（ul>li）

      相邻选择器（h1+p）

3、CSS哪些属性可继承？

     可继承：font color text-indent

     不可继承：width height border padding margin 

4、CSS优先级如何计算？

     优先级有就近原则，同权重情况下以最近者为准

     优先级为：

        相同权值情况下： 内联样式表（标签内部）> 嵌入样式表（当前文件内）> 外部样式表（外部文件中）

        权值不同的情况下：！important > id > class > tag

         标签权值为1，类选择符权值为10，id选择符权值为100。

         important比内联优先级高，但内联比id高 。

         还有个特殊权值继承0.1

5、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 单选框或复选框被选中。

 6、XML和JSON的区别？

       a. 数据体积方面。

            json相对于xml来讲，数据的体积小，传递的速度更快些。

       b.数据交互方面。

            json与javascript的交互更加方便，更容易解析处理，更好的数据交互。

       c.数据描述方面。

            json对数据的描述性比xml较差。

        d.传输速度方面。

            json的速度要远远快于xml。

7、对BFC规范的理解？

      BFC表示块级格式化上下文，触发BFC。创建了新的BFC的盒子是独立布局的，盒子里面的子元素样式不会影响到外面的元素。

      在同一个BFC中两个毗邻的块级盒的margin会发生折叠。

      相关文章可查看：

      http://www.cnblogs.com/lhb25/p/inside-block-formatting-ontext.html

8、解释下 CSS sprites，以及你要如何在页面或网站中使用它？

     CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。这样可以减少很多图片请求的开销，因为请求耗时比较长；请求虽然可以并发，但是也有限制，一般浏览器都是6个。对于未来而言，就不需要这样做了，因为有了`http2`。

9、