Ò׽ؽØÍ¼Èí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö160KB

css ÒýÈ뷽ʽÓëÑ¡ÔñÆ÷

½ñÌìѧϰÁËcssµÄÒýÈ뷽ʽºÍcssµÄÑ¡ÔñÆ÷
CssÒýÈ뷽ʽ×ܹ²ËÄÖÖ·Ö±ðÊÇ£º
1.<link rel=”realstyle” type=”text/css” href=”css.css”>
rel    ±íÃ÷Á¬½ÓµÄÎļþÓëhtmlÎĵµÖ®¼äµÄ¹ØÏµ
type ÊDZíÃ÷ÎļþÀàÐÍ
href Ö¸ÏòÁ´½ÓµÄcssÎļþ
2.ÔÚhtmlÎĵµµÄhead²¿·ÖÖ±½ÓдÈëcssÎĵµ¡£
<style type="text/css">
div{margin: 0;padding: 0;border:1px red solid;}
</style>
3. Ö±½ÓÔÚhtml±êÇ©ÀïдÈë¶ÔÕâ¸ö±êÇ©µÄcss¿ØÖÆ
Eg:<div style="border:1px red solid;">²âÊÔÐÅÏ¢</div>
4.ʹÓÃ@importÒýÈëcssÎļþ
1£ºÔÚheadÀïʹÓõÄʱºò£º
       <style type="text/css">
       @import url(my.css);
       </style>
2£ºÔÚcssÎļþÀïʹÓá£
£¨@import±¾ÉíÊÇÒ»¸öcssÃüÁî¡££©
Ñ¡ÔñÆ÷×ܹ²ÓÐÎåÖÖ·Ö±ð£º
1.ÀàÑ¡ÔñÆ÷
ÔÚ CSS ÖУ¬ÀàÑ¡ÔñÆ÷ÒÔÒ»¸öµãºÅÏÔʾ£º
HTML£º
<div class="test">²âÊÔ´úÂë</div>
CSS£º
.test {color:red;border:1px blue solid;}
×¢Ò⣺ÀàÃûµÄµÚÒ»¸ö×Ö·û²»ÄÜʹÓÃÊý×Ö£¡ËüÎÞ·¨ÔÚ Mozilla »ò Firefox ÖÐÆð×÷Óá£
2.id Ñ¡ÔñÆ÷
id Ñ¡ÔñÆ÷¿ÉÒÔΪ±êÓÐÌØ¶¨ id µÄ HTML ÔªËØÖ¸¶¨Ìض¨µÄÑùʽ¡£
id Ñ¡ÔñÆ÷ÒÔ "#" À´¶¨Òå¡£
HTML£º
<div id="test">²âÊÔ´úÂë</div>
CSS£º
#test {color:red;border:1px blue solid;}
×¢Ò⣺id ÊôÐÔÖ»ÄÜÔÚÿ¸ö HTML ÎĵµÖгöÏÖÒ»´Î¡£
3.ºó´úÑ¡ÔñÆ÷
ͨ¹ýÒÀ¾ÝÔªËØÔÚÆäλÖõÄÉÏÏÂÎĹØÏµÀ´¶¨ÒåÑùʽ£¬Äã¿ÉÒÔʹ±ê¼Ç¸ü¼Ó¼ò½à¡£
HTML£º
<div class="test">
       <span><img src="xxx" alt="ʾÀýͼƬ"/></span>
</div>
CSS£º
.test span img {border:1px blue solid;}
div span img {border:1px blue solid;}
 
4.Ⱥ×éÑ¡ÔñÆ÷
CSS£º
.test1,span,test2 {border:1px blue solid;}
div,span,img {border:1px blue solid;}
5.±êǩѡÔñÆ÷
CSS:
div {color:red;border:1px blue solid;}
span {float:right;}
½ñÌ컹ѧµ½ÁËһЩѡÔñÆ÷µÄÓÅÏȼ¶µÄ֪ʶ£¬¸Ð¾õÕâЩÄÚÈݺÜÈÝÒ׵ľÍÀí½âÁË£¬²»ÖªµÀÒÔºóÔËÓõ½ÊµÕ½ÖлáÔõôÑù£¬»¹ÊÇÊÃÄ¿ÒÔ´ý£¬µ«ÊÇÒªÏëѧÀι̻¹ÊÇҪͨ¹ý´óÁ¿µÄÁ·Ï°²ÅÄÜ´ïµ½µÃÐÄÓ¦ÊÖ¡£
 


Ïà¹ØÎĵµ£º

CSSÖÐÔªËØË®Æ½¾ÓÖÐÏÔʾµÄ·½·¨

ÓÃCSSÈÃÔªËØ¾ÓÖÐÏÔʾ²¢²»ÊǼþºÜ¼òµ¥µÄÊÂÇ顣ͬÑùµÄCSS¾ÓÖÐÉèÖÃÔÚ²»Í¬ä¯ÀÀÆ÷ÖеıíÏÖÒ²¸÷ÓÐǧÇï¡£±¾ÎľͽéÉÜÁËÔÚCSSÖг£¼ûµÄ¼¸ÖÖÈÃÔªËØË®Æ½¾ÓÖÐÏÔʾµÄ·½·¨¡£
¡¡¡¡1.ʹÓÃ×Ô¶¯Íâ±ß¾àʵÏÖ¾ÓÖÐ
¡¡¡¡CSSÖÐÊ×Ñ¡µÄÈÃÔªËØË®Æ½¾ÓÖеķ½·¨¾ÍÊÇʹÓÃmarginÊôÐÔ—½«ÔªËصÄmargin-leftºÍmargin-rightÊôÐÔÉèÖÃΪauto¼´¿É¡£ÔÚʵ¼ÊʹÓà ......

CSSÔÚUL UIÉϵÄÓ¦ÓÃ

Ч¹ûͼ£º
csstest.css
*{
 margin-left:0;
 margin-top:0;
 font-size:12px;
 color:White;    
}
#biaoge
{
/*¶ÔIDΪbiaogeµÄ±êǩʹÓôËCSS*/
    width:405px;   /*Áпí100£¬¼ÓÉÏÎå¸öΪ1µÄ±ß¾à£¬ËÄÁоÍÊÇ405*/
  &nbs ......

CSSÂ˾µ±Ê¼Ç °üº¬LightÂ˾µ·½·¨µÄʹÓÃ

Alpha
1. Óï·¨: {filter: alpha(opacity=opacity, finishopacity=finishopacity, style=style, startx=startx, starty=starty, finishx=finishx, finishy=finishy)}
2. ÒâÒå: °ÑÒ»¸öÄ¿±êÔªËØÓë±³¾°»ìºÏ, ÉèÖÃÕß¿ÉÒÔÖ¸¶¨ÊýÖµÀ´¿ØÖÆ»ìºÏµÄ³Ì¶È
3. ÊôÐÔ
3.1. opacity: ͸Ã÷¶Èˮƽ, 0ΪÍêȫ͸Ã÷, 100ΪÍêÈ«²»Í¸Ã÷
3.2. fin ......

div+cssÍøÒ³Éè¼Æ¼¼ÇÉ»ã×Ü

½ñÌìÎÒÃÇ»ã×ÜÁËÐí¶àdiv+cssÍøÒ³Éè¼ÆÖо­³£Óõ½µÄ¾­ÑéºÍ¼¼ÇÉ£¬´ó¼Ò¿ÉÒÔ¶à¶à²Î¿¼£¬¶ÔÄãµÄÒ³ÃæÉè¼ÆÒ»¶¨ÓкܴóµÄ°ïÖú!
Èç¹ûÎÄ×Ö¹ý³¤£¬Ôò½«¹ý³¤µÄ²¿·Ö±ä³ÉÊ¡ÂÔºÅÏÔʾ£ºIE5£¬FFÎÞЧ£¬µ«¿ÉÒÔÒþ²Ø£¬IE6ÓÐЧDIV STYLE=“width£º120px£»height£º50px£»border£º1px solid blue£»overflow£ºhidden£»text-overflow£ºellipsis&rdquo ......

CSS¼æÈÝÐÔ£¨1£© !important

Ðí¶àÈËÈÏΪie6²»Ö§³Ö!important£¬ÆäʵÊDZ»Ò»ÌõÕë¶Ôie 6µÄcss hack¸øÎóµ¼ÁË¡£ÕâÌõcss hackÊÇ£º
.test {
    height: auto !important;
    height: 500px;
}
.testµÄ¸ß¶ÈÔÚÆäËûä¯ÀÀÆ÷ÀïÃæÊÇauto£¬¶øÔÚie6ÀïÃæÊÇ500px£¬Ðí¶àÈËÔÚ½âÊÍÕâÌõcss hackÖ®ËùÒÔ»áÉúЧÊÇÒòΪie6²»Ö§³Ö!important£¬Îóµ¼Á˲»ÉÙÈ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ