css练习

<!--1.列举你知道的css选择器-->
基本选择器：标签选择器、id选择器、类选择器
高级选择器：并集选择器、交集选择器、后代选择器、子元素选择器、伪类选择器、伪元素选择器

<!--2.分别阐述类选择器和id选择器的作用-->
ID选择器，#开头，ID不能重复
类选择器，.开头，类可以重复
一个页面上所有控件都ID不能重复,但class可以被多个 html控件套用.

<!--3.如何重置网页样式-->
*｛padding:0;margin:0｝ or 百度里搜reset.css找别人写好的复制

<!--4.对盒模型是怎么理解的？它们的属性有哪些？-->
盒模型：在网页中基本上都会显示一些方方正正的盒子，这种盒子成为盒模型
属性：width、height、padding、border、margin

<!--5.什么是标准文档流？-->
网页在解析的时候，遵循于从上向下，从左向右的一个顺序，而这个顺序就是来源于标准文档流。

<!--6.浮动盒子的特点？浮动的好处？如何清除浮动？-->
特点：脱标，相互贴靠，有“字围”效果，紧凑的效果
好处：脱标，相互贴靠，有“字围”效果，紧凑的效果
清除浮动：1、给父盒子设置高度（这种方法不灵活）
2、clear：both 给浮动的元素最后面加上一个空的div，并且设置这个元素不浮动，然后设置clear：both
3、伪元素清除法（常用）：父盒子类名设置为clearfix。clearfix：｛content：“”；clear：both；display：block
height：0；visibility:hidden｝
4、overflow：hidden(常用)
<!--7.精灵图的好处是什么？-->
1、利用CSS Sprites能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；
2、CSS Sprites能减少图片的字节，曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。
3、解决了网页设计师在图片命名上的困扰，只需对一张集合的图片上命名就可以了，不需要对每一个小元素进行命名，从而提高了网页的制作效率。
4、更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式，整个网页的风格就可以改变。维护起来更加方便

<!--8.定位有几种？阐述一下“父相子绝”定位是怎样理解的？-->
相对定位、绝对定位、固定定位
子元素绝对定位，父元素相对定位。让子元素 以其父元素为标准来定位。（如果不这么做，子元素就会相对body或浏览器定位产生不好的效果。）

<!--9.什么样的盒子脱离了文档标准流？脱离文档标准流的盒子的特点是怎样的？-->
浮动、绝对定位、固定定位、父子关系：儿子就是占用父亲内容的宽高，和父亲的padding没有关系。

<!--10.z-index的规则是怎样的？-->
层级关系的属性
1、z-index表示谁压着谁，数值大的压盖住数值小的
2、只有定位了的元素，才能有z-index，也就是说，无论相对定位、绝对定位、还是固定定位，都可以使用z-index,而浮动元素不能使用。
3、z-index没有单位，就是一个正整数，默认为0.
4、如果大家都没有z-index，或者z-index值都一样，谁写在HTML后面，谁就在上面压着。定位了的元素，永远压着没有定位的元素。
5、从父现象：父亲怂了，儿子再牛逼也没有用。

<!--11.display属性值有哪些？分别描述他们的意思？-->
none：此元素不显示。
block：将元素显示为块级元素，前后会带换行符。
inline:默认值，元素会被显示为内联元素，前后没有换行符。
inline-block:行内块级元素。