常用CSS和jquery记录

1.换行

div自动换行的css:

word-wrap:break-word; 
word-spacing:normal;

pre自动换行的css:

  word-wrap:break-word;
  white-space: pre-wrap;

2.li的样式，把前面的点设置为内联，并设置点得颜色

list-style: inherit;
list-style-type:square;
color:#5b5b5b;

3.jquery的each

$(document).ready(function(){
var cs= $("#midshowleft .midcategory");
$(cs).each(function() {
$(this).click(function(){
$(cs).each(function(){
$(this).removeClass().addClass("midcategory");
});
$(this).removeClass().addClass("sel midcategory");
});
});
});

4.css中设置透明

background: #fff;
opacity: .5;
filter: alpha(opacity=50);

5.IE6下min-height不管用

min-height:500px;
_width:500px; _white-space:nowrap;

6.IE8下报这个错

HTML Parsing Error: Unable to modify the parent container element before the

是因为body没加载完成，js就操作了document

解决方法http://www.cnblogs.com/acker/archive/2011/07/27/2117927.html

7.IE6下border-bottom位置不对

_display:inline-block;/

8.设置span的宽度

display:-moz-inline-box; 
display:inline-block; 
width:150px; 

9.图片和文字水平对其

测试文字<span style="vertical-align:middle;"><img src="images/head/head_line.png" /></span> 

10.图片原比例缩放，并且水平、垂直方向居中

.waiceng{
        width:498px;
        height:468px;
        border:1px solid #cfcfcf;
        text-align:center;
        overflow: hidden;
        vertical-align: middle;
        display: table-cell;
}
.neiimg{
        max-width:498px;
        max-height:468px;
        _width:498px;
        _height:498px;
        _white-space: nowrap;
}

<div class="waiceng">
<img src="xxx" class="neiimg" />
</div>

11.textarea不可变

resize: none;

12.IE7下的css问题

1.如果使用position:absolute，定位必须2点定位，

   eg:bottom:4px;   错

         bottom:4px; right:5px;   对

   父级元素必须使用position:relative  

2.使用li时，float:left; 必须指定li的宽度，否则会多出来一块

   如果<a>里面包含图片，则要设置图片的css: img{position:relative; z-index:1;};  否则链接失效

3.ie8下网站直接死掉(c0000005 ),原因竟然是html标签没有结束，以后写html代码要严谨