css常见问题解析1

1、处理元素溢出

如果一个元素的大小设置太小，以致不能包含其内容，我们可以在该元素上使用overflow属性制定其内容不能填充时如何处理。

取值可以是：visible、hidden、scroll、auto，其中visible是默认值，表示不裁剪内容，也不添加滚动条，强制显示元素内容。

hidden表示裁剪内容，不显示超出对象尺寸的内容，scroll表示裁剪内容，同时提供滚动条，auto表示自动裁剪并添加滚动条，需要注意的是，在使用overflow时，必须指定该元素的position为absolute。

2、指定裁剪区域

绝对定位的元素溢出时除了可以设置overflow外，还可以创建一个矩形建材区域，以限制内容的哪块区域可见。clip属性可以确定定位对象的裁剪区域，其取值为rect（top right bottom left）/auto，指定上、右、下、左四个方向上的裁剪长度，取值为auto时，相当于该边没有进行裁剪。

3、设置元素的可见性

在css中，有两个属性可以设置元素的显示和隐藏，即display和visibility属性。

display确定一个元素是否应该显示在页面上及如何显示，它的取值为：none、block、inline等，为none时，元素在页面隐藏起来，而且也将清楚占位，为block时，强制将行级元素变为块级元素，从而引起后续对象换行，为inline时，强制将块级元素变为行级元素。

visibility取值包括：hidden、visible和inherit，与overflow不同的是，当隐藏元素时，visibility属性定义的元素仍然为保留原有的显示空间。

4、处理元素重叠

使用left和top时。可能造成元素的相互重叠在一起，此时可以使用Z-index属性来控制重叠元素的显示顺序，值较高的元素将覆盖值较低的元素，使用-1时，则表示元素将至于页面默认文本的后边，对于设置背景图案是很有用的。必须在设置了position为absolute或者relative时使用才有效。

5、浏览器css兼容问题的解决

浏览器显示不兼容，是web设计者的噩梦，对于不同的浏览器对css的解析认识不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果，就需要去针对不同的浏览器写不同的css，这个在针对不同浏览器与不同的css代码的过程，就叫css hack。

在css hack技巧中，最常用的两个符号：下划线    和星号*，以及css优先级规则声明关键字！important。

在IE6中，能识别下划线和星号，以及但不能识别important;

IE7能识别星号和！important，但是不能识别下划线

FireFox只能识别！important，但是不能识别下划线和星号