CSS个人收集，仅供参考

#AirportPic
{
    background: url(/images/un_pic_tab.png) 0 -110px;
    width: 270px;
    color: #4D4D4D;
    height: 50px;
    line-height: 54px;
    overflow: hidden;
    margin-bottom: 5px;
    padding: 0 10px;
}

当ul li宽度不够却不自动换行的解决方法。

.cf::after {
content: ".";
display: block;
clear: both;
font-size: 0;
height: 0;
line-height: 0;
visibility: hidden;
overflow: hidden;
}

以上这两个代码是让li之类的在容器里面，如果容器不够宽度后自动换行显示。

BORDER-COLLAPSE: collapse

tabel的细边框。

<select id="lblProvinceOfCity" size="15"  style="height:220px;200px">
         <option>--请选择城市--</option>
</select>

你想设置高度后如果不设置size，select将会变得很大很难看。不能用multiple="multiple"来设置高度，因为这个属性是多选属性。

.header{
 text-indent:-9999px;
 background:url('someimage.jpg') no-repeat;
 height: 100px; /*dimensions equal to image size*/
 width:500px;
}

这是一个很好的SEO技巧，让你看到一个不错的花哨的图像，而不是简单枯燥的文字，但搜索引擎将只能看到文字。
不知道这算不算是一个作弊的行为。text-indent为正值意为文本块向右缩进长度，为复制意为文本块向左缩进长度。上面的效果是，将文字移出了浏览器的视野之内，但是搜索引擎会找得到。

#container{
 height:auto !important;/*all browsers except ie6 will respect the !important flag*/
 min-height:500px;
 height:500px;/*Should have the same value as the min height above*/
}

Internet Explorer不理解min-height属性，但这里的CSS技巧来完成，在IE浏览器。跨浏览器的最低高度（让IE支持min-height）

transparent_class {
 filter:alpha(opacity=50);
 -moz-opacity:0.5;
 -khtml-opacity: 0.5;
 opacity: 0.5;
}

虽然CSS3标准包括Opacity属性，但不是每个浏览器都支持它跨浏览器的透明度，这里的CSS技巧。跨浏览器支持不透明度

line-height:30px;
height:30px;

如果您使用的是固定高度容器和垂直居中的文本，使用line-height属性，line-height像素和高度一致，完美地做到这一点。

body{
 width:980px;
 margin:0 auto;
}

让body笃定宽度并且居中。

text-transform: capitalize;

让每个单词的首字母大写。

font-variant:small-caps;

让所有字母都大写。

a img{ border:none; }

图片超链接通常会得到一个丑陋的蓝色边框，使您的图像超链接看起来可怕。

@font-face {
    font-family: Blackout;
    src: url("assests/blackout.ttf") format("truetype");
}

@font-face 能够加载服务器端的字体文件，让客户端显示客户端所没有安装的字体。Blackout即为字体的名称

input[type="text"] {
    width: 200px;
}

定义文本框样式。

onerror="javascript:this.src='../indexImages/daex03.jpg'"

在图片标签上加上这个，就可以在图片丢失或者其他原因不显示的时候显示默认图片

#divSearch input {
vertical-align: middle;
}

在控件的同一行让文字垂直居中

html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,
 del, dfn, em, font, img, ins, kbd, q, s, samp,
 small, strike, strong, sub, sup, tt, var,
 b, u, i, center,
 dl, dt, dd, ol, ul, li,
 fieldset, form, label, legend,
 table, caption, tbody, tfoot, thead, tr, th, td {
     margin: 0;
     padding: 0;
     border: 0;
     outline: 0;
     font-size: 100%;
     vertical-align: baseline;
     background: transparent;
 }
 
 body {
     line-height: 1;
 }
 
 ol, ul {
     list-style: none;
 }
 
 blockquote, q {
     quotes: none;
 }
 
 blockquote:before, blockquote:after,
 q:before, q:after {
     content: '';
     content: none;
 }
 
 /* remember to define focus styles! */
 :focus {
     outline: 0;
 }
 
 /* remember to highlight inserts somehow! */
 ins {
     text-decoration: none;
 }
 
 del {
     text-decoration: line-through;
 }
 
 /* tables still need 'cellspacing="0"' in the markup */
 table {
     border-collapse: collapse;
     border-spacing: 0;
 }

属性重置

/* external links */
 a[href^="http://"]{
     padding-right: 20px;
     background: url(external.gif) no-repeat center right;
 }
 
 /* emails */
 a[href^="mailto:"]{
     padding-right: 20px;
     background: url(email.png) no-repeat center right;
 }
 
 /* pdfs */
 a[href$=".pdf"]{
     padding-right: 20px;
     background: url(pdf.png) no-repeat center right;
 }

根据文件格式显示不同的链接样式

box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
 -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
 -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);

影子盒

.intxt
        {
            border: 1px solid #D8D8D8;
            width: 200px;
            height: 18px;
            padding: 5px 0 5px 5px;
            line-height: 18px;
            font-size: 14px;
            box-shadow: inset 1px 1px 2px #E9E9E9;
        }
        .serchBut
        {
            width: 108px;
            height: 28px;
            border: 1px solid #D87114;
            font-size: 14px;
            cursor: pointer;
            background: #FF9E32;
            background: -moz-linear-gradient(top, #FFD29A 0, #FFA53A 5%, #FF882A 100%);
            background: -webkit-linear-gradient(top, #FFD29A 0, #FFA53A 5%, #FF882A 100%);
            background: linear-gradient(to bottom, #FFD29A 0, #FFA53A 5%, #FF882A 100%);
        }

文本框和按钮的漂亮样式，兼容浏览器

.div{
        position:absolute;
    top:50%;
    left:50%;
    margin:-150px 0 0 -200px;
    width:400px;
    height:300px;
}

让div在body中垂直居中

.ico
{
    background: url(/images/Menpiao/iconset.png) no-repeat -100px -100px;
    padding-left:20px;
}

使用图片集。可以放在一个span里面，但是里面不用放空格已腾出空间

在IE下<a>标签里面的图片会出现蓝色边框，这个时候只要在img里面加上border=“0”就行了。

在容器内（只针对一行文本），如果查过容器长度，即被截取并加上“…”

200px;
height:100px;
border:1px solid red;
border-top:4px solid red;
padding:10px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;

容器不能随里面的内容自动撑开，一般用下面这个就可以解决，如果不行用display:inline-block也行

.box:after
{
    content: ".";
    display: block;
    clear: both;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    overflow: hidden;
}