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

¡¶¾«Í¨CSS¸ß¼¶WEB±ê×¼½â¾ö·½°¸¡·µÚÆßÕ ²¼¾Ö

ÎÒÔÚwww.c09.com ·¢±íÁËÕâ¸ö±Ê¼Ç²¢ÉÏ´«ÁËÔ­ÖøµÄPDF£¬½ñÌìÓпգ¬×ªµ½BLOGÉÏÀ´¡£
µÚÆßÕÂ ²¼¾Ö
ËùÓÐCSS²¼¾Ö¼¼Êõ¶¼ÒÀÀµÓÚÈý¸ö»ù±¾¸ÅÄ¶¨Î»¡¢¸¡¶¯ºÍ¿Õ°×±ß²Ù×Ý
7.1 ÈÃÉè¼Æ¾ÓÖÐ[code]
<body>
<div id='wrapper'>
</div>
</body>
/*×îÃ÷Á˵ľÓÖз½°¸£¬¿ÉϧIE6²»Ö§³Ö*/
#wrapper{
    width:720px;
    margin:0 auto;
}
/*ÀûÓÃIe¶Ôtext-alignµÄÀí½âBUG½â¾öIE6Ö§³ÖÎÊÌâ*/
body{
  text-algin:center;
  min-width:760px;/*Èç¹û´°¿Ú¿í¶ÈСÓÚ760px¾Í²»ÔÙ×ÔÊÊÓ¦ËõС*/
}
#wrapper{
   width:720px;
   margin:0 auto;
   text-algin:left;
}
/*Ò²¿ÉÒÔ²ÉÓÃÕâÖÖ·½·¨,Ö»Ð趨ÒåwrapperÒ»¸öÔªËØ*/
#wrapper{
    width:720px;
    position:relative;
    left:50%;
    margin-left:-360px;
}
[/code]7.2 ¹Ì¶¨¿í¶ÈµÄ²¼¾Ö[code]
/*ÕâÊÇÒ»¸ö·Ç³£³£¼ûµÄÁ½Áв¼¾Ö*/
<div id='wrapper'>
<div id='branding'>
...
</div>
<div id='content'>
...
</div>
<div id='mainNav'>
...
</div>
<div id='footer'>
...
</div>
</div>
/*Á½Áв¼¾ÖµÄCSSÉ趨ºÜ¼òµ¥*/
#content{
    width:520px;
    float:right;
}
#mainNav{
    width:180px;
    float:left;
}
#footer{
    clear:both;
}
/*ÈÃÎÄ×ÖÓëÈÝÆ÷±ßÔµ±£³Ö¾àÀë*/
#mainNav{
   padding-top:20px;
   padding-bottom:20px;
}
#mainNav li{
   padding-left:20px;
   padding-right:20px;
}
#content h1,#content h2,#content p{
    padding-right:20px;
}
/*ÈýÁв¼¾Ö£¬¿ÉÒÔÔÚÓÒ²àcontentÖÐÔÙÌí¼ÓÒ»À¸*/
<div id='content'>
<div id='mainContent'>
......
</div>
<div id='secondaryContent'>
...
</div>
</div>
/*Ö»ÒªÒ»¸ö×ó¶ÔÆë£¬ÁíÒ»¸öÓÒ¶ÔÆë¾Í¿ÉÒÔÁË*/
#mainContent{
    width:320px;
    float:left;
}
#secondaryContent{
    width:180px;
    float:right;
}
[/code]Á÷Ìå²¼¾Ö[code]
/*²¼¾Ö¿í¶È¸ù¾Ý´°¿Ú´óС×ÔÊÊÓ¦*/
#w


Ïà¹ØÎĵµ£º

ÍøÕ¾ºÚ°×°æµÄcssÑùʽ

1¡¢CSS·ç¸ñÍøÕ¾£¬½«ÏÂÃæÕâ¶Î´úÂëÌí¼Óµ½ÍøÕ¾cssÎļþ×î¶¥¶Ë¡£
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
»òÕߣº
ÔÚcssÎļþµÄbodyÖмÓÈëfilter:gray£º
body {filter:gray}
¡¡¡¡2¡¢Î´ÆôÓÃCSS·ç¸ñÍøÕ¾£¬ÔÚÍøÒ³»òÕßÄ£°åµÄHTML´úÂëºÍÖ®¼ä²åÈëÒÔÏ´úÂ룺
<style>
html{filter:pro ......

ÍøÕ¾±äºÚ»ÒÉ«CSSÂ˾µ´úÂë

ÍøÕ¾±äºÚ»ÒÉ«CSSÂ˾µ´úÂë
Òý×Ô:http://edu.seuuo.com/html/81/n-12181.html
Ϊ·½±ãÕ¾µã°§µ¿£¬ÌØÌṩcssÂ˾µ´úÂ룬ÒÔ±í°§µ¿¡£ÒÔÏÂΪȫվCSS´úÂë¡£
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
ʹÓ÷½·¨£ºÕâ¶Î´úÂë¿ÉÒÔ±äÍøÒ³ÎªºÚ°×£¬½«´úÂë¼Óµ½CSS×î¶¥¶Ë¾Í¿ÉÒÔʵÏÖËØ×°¡£½¨ÒéÈ«¹úÕ¾³¤¶¯ ......

´¿CSSʵÏÖÏÂÀ­Áбí

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>ÎÞ±êÌâÎĵµ</ ......

CSS hack:Çø·ÖIE6£¬IE7£¬firefox

ת×Ô£ºhttp://www.div-css.com/html/XHTML-CSS/hack/1136667.html
Çø±ð²»Í¬ä¯ÀÀÆ÷£¬CSS hackд·¨£º
Çø±ðIE6
ÓëFF
£º
       background:orange
;*
background:blue
;
Çø±ðIE6
ÓëIE7
£º
       background:green
 !important
;background:blue
;
Çø±ðIE7
Ó ......

ÓÃCSSÉèÖÃÎı¾µÄÊôÐÔ

Ò»¡¢CSS Ö㤶ÈÓëÑÕÉ«
1¡¢³¤¶Èµ¥Î»ËµÃ÷
in Ó¢´ç
cm ¹«·Ö
mm ¹«Àï
cm ÒÔĿǰ×ÖÌå¸ß¶ÈΪµ¥Î»
ex ÒÔСд×Öĸ¸ß¶ÈΪµ¥Î»£¨´ó²¿·Ö²»Ö§³Ö£©
pt 1pt/72Ó¢´ç
pc 1pc/12pt
px ÏñËØ£¨ÍƼöʹÓã©
2¡¢ÑÕÉ«µ¥Î»£º ˵Ã÷
Ê®Áù½øÖÆÈ磺color:#ff0000
ÑÕÉ«Ãû³ÆÈ磺color:red
ÈýÔ­É«µ¥Î»È磺rgb(255,0,0)
Ò»°ã×î³£ÓõÄÊÇÊ®Áù½øÖ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ