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 Ö¸²ãµþÑùʽ±í (Cascading Style Sheets)
Ñùʽ¶¨ÒåÈçºÎÏÔʾ HTML ÔªËØ
Ñùʽͨ³£´æ´¢ÔÚÑùʽ±íÖÐ
°ÑÑùʽÌí¼Óµ½ HTML 4.0 ÖУ¬ÊÇΪÁ˽â¾öÄÚÈÝÓë±íÏÖ·ÖÀëµÄÎÊÌâ
ÍⲿÑùʽ±í¿ÉÒÔ¼«´óÌá¸ß¹¤×÷ЧÂÊ
ÍⲿÑùʽ±íͨ³£´æ´¢ÔÚ CSS ÎļþÖÐ
¶à¸öÑùʽ¶¨Òå¿É²ãµþΪһ
Ñùʽ½â¾öÁËÒ»¸öÆÕ±éµÄÎÊÌâ
HTML ±êǩԱ¾± ......
1.ͼƬµÄ´¹Ö±¾ÓÖÐ
.box
{
/*·ÇIEµÄÖ÷Á÷ä¯ÀÀÆ÷ʶ±ðµÄ´¹Ö±¾ÓÖеķ½·¨*/
display: table-cell;
vertical-align: middle; /*ÉèÖÃˮƽ¾ÓÖÐ*/
text-align: center;
/* Õë¶ÔIEµÄHack */
*display:block;
......
Putting the CSS Friendly Control Adapters to work
Menu Control Horizontal Layout - Asp.net 2.0
Putting the CSS Friendly Control Adapters to work
The CSS Friendly Control Adapters 1.0 override the default HTML generated by the ASP.NET Web controls to provide a more standar ......
ÓÃCSSÈÃÔªËØ¾ÓÖÐÏÔʾ²¢²»ÊǼþºÜ¼òµ¥µÄÊÂÇ顣ͬÑùµÄCSS¾ÓÖÐÉèÖÃÔÚ²»Í¬ä¯ÀÀÆ÷ÖеıíÏÖÒ²¸÷ÓÐǧÇï¡£±¾ÎľͽéÉÜÁËÔÚCSSÖг£¼ûµÄ¼¸ÖÖÈÃÔªËØË®Æ½¾ÓÖÐÏÔʾµÄ·½·¨¡£
¡¡¡¡1.ʹÓÃ×Ô¶¯Íâ±ß¾àʵÏÖ¾ÓÖÐ
¡¡¡¡CSSÖÐÊ×Ñ¡µÄÈÃÔªËØË®Æ½¾ÓÖеķ½·¨¾ÍÊÇʹÓÃmarginÊôÐÔ—½«ÔªËصÄmargin-leftºÍmargin-rightÊôÐÔÉèÖÃΪauto¼´¿É¡£ÔÚʵ¼ÊʹÓà ......
CSSÃüÃû¹æ·¶
Ò»£®ÎļþÃüÃû¹æ·¶
È«¾ÖÑùʽ£ºglobal.css£»
¿ò¼Ü²¼¾Ö£ºlayout.css£»
×ÖÌåÑùʽ£ºfont.css£»
Á´½ÓÑùʽ£ºlink.css£»
´òÓ¡Ñùʽ£ºprint.css£»
¶þ£®³£ÓÃÀà/IDÃüÃû¹æ·¶
Ò³¡¡Ã¼£ºheader
ÄÚ¡¡ÈÝ£ºcontent
ÈÝ¡¡Æ÷£ºcontainer
Ò³¡¡½Å£ºfooter
°æ¡¡È¨£ºcopyright¡¡
µ¼¡¡º½£ºmenu
Ö÷µ¼º½£ºmainMenu
×Óµ¼º½£ºsu ......