22个必须知道的css技巧

::selection{ /* Safari and Opera */
    background:#c3effd;
    color:#000;
}
::-moz-selection{ /* Firefox */
    background:#c3effd;
    color:#000;
}

html{ overflow-y:scroll; }

.page-break{ page-break-before:always; }

.page { background-color:blue !important;   background-color:red;}

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

#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*/
}

a[target="_blank"]:before,
a[target="new"]:before {
    margin:0 5px 0 0;
    padding:1px;
    outline:1px solid #333;
    color:#333;
    background:#ff9;
    font:12px "Zapf Dingbats";
    content: "\279C";
}

ol {
    font: italic 1em Georgia, Times, serif;
    color: #999999;
}
ol p {
    font: normal .8em Arial, Helvetica, sans-serif;
    color: #000000;
}

p:first-letter{
display:block;
margin:5px 0 0 5px;
float:left;
color:#FF3366;
font-size:3.0em;
font-family:Georgia;
}

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

line-height:30px;

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

textarea{
    overflow:auto;
}

a:active, a:focus{ outline:none; }

position:relative;

a[href$=‘.doc‘] {
    padding:0 20px 0 0;
    background:transparent url(/graphics/icons/doc.gif) no-repeat center right;
}

input[type=submit],label,select,.pointer { cursor:pointer; }

text-transform: capitalize;

font-variant:small-caps;

input[type=text]:focus, input[type=password]:focus{
    border:2px solid #000;
}

a img{ border:none; }

<form method="post" action="#" >
<p><label for="username" >Username</label>
<input type="text" id="username" name="username" />
</p>
<p><label for="password" >Username</label>
<input type="password" id="password" name="pass" />
</p>
<p><input type="submit" value="Submit" /></p>
</form>

p label{
    width:100px;
    float:left;
    margin-right:10px;
    text-align:right;
}