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

³£ÓÃCssÑùʽ

/*±êÌâÔªËØ*/
h1,h2,h3,h4,h5,h6 {
  color: green;
  }
/*¸¸ÔªËؼ̳Ð*/
body {
     font-family: Verdana, sans-serif;
     }
/*id Ñ¡ÔñÆ÷*/
#red {color:red;}
/*id Ñ¡ÔñÆ÷ºÍÅÉÉúÑ¡ÔñÆ÷*/
#red p {
font-style: italic;
text-align: right;
margin-top: 0.5em;
}
/*ÀàÑ¡ÔñÆ÷*/
.center {text-align: center}
/*ÊôÐÔ*/
/*±³¾°*/
background-color: gray;
background-image:url(../image/topmiddle.jpg);
background-repeat:no-repeat;
/*ÎÄ×Ö*/
text-align:left;
font-size:11px;
font-family:ºÚÌå;
line-height:25px;*Ðмä¾à*/
text-indent:16px;/*ÎÄ×ÖËõ½ü*/
letter-spacing ;/*ÎÄ×ÖÖ®¼äµÄ¼ä¸ô*/
word-spacing ;/*µ¥´ÊÖ®¼äµÄ¼ä¸ô*/
/*Íâ±ß¾à*/
margin-top:5px;
/*Äڱ߾à*/
padding-bottom:30px;
/*±ß¿ò*/
border-color:#e1e0e0;
  border-style:solid;
  border-width:0px 1px 1px 1px;
/*¸¡¶¯*/
float: left;
/*¾ø¶Ô¶¨Î»*/
#box_relative {
  position: absolute;
  left: 30px;
  top: 20px;
}
/*Ïà¶Ô¶¨Î»*/
#box_relative {
  position: relative;
  left: 30px;
  top: 20px;
}


Ïà¹ØÎĵµ£º

ûÏëµ½µÄ¡¢²»³£ÓõÄÈý¸öcssÊôÐÔ£¡

×÷Õߣºtinyhill¡¡À´×Ô£ºÀ¶É«ÀíÏë ¶Ô ¡¶5 ¸ö¼òµ¥ÊµÓÃµÄ CSS ÊôÐÔ¡·½øÐб༭
1¡¢CSS Clip
¼ô¼­ (clip) ÊôÐÔ¾ÍÏñÒ»¸öÃæ¾ß¡£ËüÔÊÐíÄãʹÓþØÐÎÑÚ¸ÇÒ³ÃæÔªËØµÄÄÚÈÝ¡£Òª¼ô¼­Ò»¸öÔªËØ£ºÄã±ØÐëÖ¸¶¨Æä position ÊôÐÔΪ absolute£¬È»ºóÖ¸¶¨Ïà¶ÔÓÚÔªËØµÄ top£¬right£¬bottom£¬left Öµ¡£
ͼƬ¼ô¼­ÊµÀý£¨ÑÝʾ£©
ÒÔÏÂʾÀýÑÝʾÁËÈç ......

css ³¬¹ý¿í¶ÈµÄÎÄ×ÖÏÔʾµãµã

text-overflow : ellipsis;
white-space : nowrap;
overflow : hidden;
½âÊÍһϣº
text-overflow £ºellipsis; //ÈýضϵÄÎÄ×ÖÏÔʾΪµãµã¡£»¹ÓÐÒ»¸öÖµÊÇclipÒâ˼Êǽضϲ»ÏÔʾµãµã
white-space : nowrap; //ÈÃÎÄ×Ö²»»»ÐÐ
overflow : hidden; //³¬³öÒªÒþ²Ø
ÒªÏÔʾΪµãµã£¬3¸öȱһ²»¿É£¬»¹ÓУ¬³ýÁËfirefox,operaÆäËûä¯ ......

ÈçºÎʹCSSäÖȾ¸ü¸ßЧ

ÎÒ³ÐÈÏÎÒ²¢²»¾­³£ÏëÕâ¸öÎÊÌâ......ÎÒÃÇдµÄcssµÄЧÂÊÊÇÔõôÑùµÄÄØ£¬ä¯ÀÀÆ÷äÖȾµÄËÙ¶ÈÓÖÈçºÎÄØ£¿
ÕâÊÇÓ¦¸ÃÊÇä¯ÀÀÆ÷¿ª·¢ÕßÓ¦¸Ã¹ØÐĵÄ(Ò³Ãæ¼ÓÔØ¸ü¿ì£¬Óû§¾Í»á¸üÓä¿ì)¡£MozillaÓÐһƪÎÄÕ£ºabout best practices . Googleµ±È»Ò²ºÜ¹ØÐÄÕâ¸öÎÊÌ⣬ËûÃÇÒ²ÓÐÕâÑùһƪÎÄÕ£ºOptimize browser rendering ¡£
ÈÃÎÒÃÇÁ˽âÏÂËûÃÇÖ÷Òª³« ......

DIV+CSS ÃüÃû³£ÓõÄ

ÍøÒ³ÇÐͼ¹ý³ÌÖÐdiv+cssÃüÃû¹æÔò
ÄÚÈÝ£ºcontent/container µ¼º½£ºnav ²àÀ¸£ºsidebar ¡¡ ¡¡
À¸Ä¿£ºcolumn ±êÖ¾£ºlogo Ò³ÃæÖ÷Ì壺main ¡¡¡¡
¹ã¸æ£ºbanner Èȵ㣺hot ÐÂÎÅ£ºnews
ÏÂÔØ£ºdownload ×Óµ¼º½£ºsubnav ²Ëµ¥£ºmenu
ËÑË÷£ºsearch Ò³½Å£ºfooter ¹ö¶¯£ºscroll
°æÈ¨£ºcopyright ÓÑÇéÁ´½Ó£ºfriendlink ×Ӳ˵¥£ºsub ......

[webÉè¼Æ] CSS Sprites ͼƬÕûºÏ¼¼Êõ

cssÖÐÓÃÒ»Õű³¾°Í¼×öÒ³ÃæµÄ¼¼ÊõÓÐʲôÓÅÊÆ£¿
¼òµ¥½éÉÜһϠCSS Sprites µÄÓŵ㣺
µ±Óû§ÍùUÅÌÖп½200ÕÅͼƬ£¬»áµÈ
ºÜ¾Ã¡£µ«ÊÇÈç¹ûŪ³ÉÒ»¸öÎļþ£¬ÔÙ¿½±´¾Í»á¿ìºÜ¶à¡£
CSS Sprites µÄÄ¿µÄ¾ÍÊÇͨ¹ýÕûºÏͼƬ£¬¼õÉÙ¶Ô·þÎñÆ÷µÄÇëÇóÊýÁ¿£¬´Ó¶ø¼Ó¿ìÒ³Ãæ¼ÓÔØ
ËÙ¶È¡£

ʵ
ÏÖ·½·¨
£º

Ê×ÏȽ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ