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

ÓÐÀûÓÚSEOµÄDIV+CSSµÄÃüÃû¹æÔòС½á

Ò»¡¢CSSÎļþ¼°ÑùʽÃüÃû
1¡¢CSSÎļþÃüÃû¹æ·¶
È«¾ÖÑùʽ£ºglobal.css£»
¿ò¼Ü²¼¾Ö£ºlayout.css£»
×ÖÌåÑùʽ£ºfont.css£»
Á´½ÓÑùʽ£ºlink.css£»
´òÓ¡Ñùʽ£ºprint.css£»
2¡¢CSSÑùʽÃüÃû¹æ·¶
±¾È˽¨Ò飺ÓÃ×Öĸ¡¢_ºÅ¹¤¡¢-ºÅ¡¢Êý×Ö×é³É£¬±ØÐëÒÔ×Öĸ¿ªÍ·£¬²»ÄÜΪ´¿Êý×Ö¡£ÎªÁË¿ª·¢ºóÑùʽÃû¹ÜÀí·½±ã£¬´ó¼ÒÇëÓÃÓÐÒâÒåµÄµ¥´Ê»òËõд×éºÏÀ´ÃüÃû£¬ÈÃͬÊÂÒ»¿´¾ÍÃ÷°×ÕâÑùʽ´ó¸ÅÊÇÄÄÒ»¿éµÄ£¬ÕâÑù¾Í½ÚÊ¡Á˲éÕÒÑùʽµÄʱ¼ä£¬ÀýÈ磺
Í·²¿ÑùʽÓÃheader£¬Í·²¿×ó±ß£¬¿ÉÒÔÓÃheader_left»òheader_l,»¹ÓÐÈç¹ûÊÇÁнṹµÄ¿ÉÒÔÕâÑù——box _1of3 (ÈýÁÐÖеĵÚÒ»ÁÐ)£¬box_2of3 (ÈýÁÐÖеĵڶþÁÐ)¡¢box _3of3 (ÈýÁÐÖеĵÚÈýÁÐ)£¬ÆäËüµÄÎҾͲ»Ò»Ò»¾ÙÀýÁË£¬´ó¼Ò°´ÒÔÉϹæÂÉÈ¥ÃüÃû¾ÍºÃ¡£
ÏÂÃæÁгöһЩ³£ÓõÄÃüÃûµ¥´Ê·½±ã´ó¼ÒʹÓ㺣¨ÒÔºó´ó¼Ò¹¤×÷¹ý³ÌÖÐÂýÂý°Ñ×Ô¼º»ýÀ۵ĵ¥´Ê¶¼¹²Ïí³öÀ´£¬ÄÇ´ó¼ÒµÄÃü¾Í»á¸ü¼ÓͳһÁË£¬¾Í²»»áÓÐÒ»Òå¶à´ÊµÄÇé¿öÁË¡££©
ÈÝ Æ÷£ºcontainer/box
Í· ²¿£ºheader
Ö÷ µ¼ º½£ºmainNav
×Ó µ¼ º½£ºsubNav
¶¥ µ¼ º½£ºtopNav
ÍøÕ¾±êÖ¾£ºlogo
´ó ¹ã ¸æ£ºbanner
Ò³ÃæÖв¿£ºmainBody
µ× ²¿£ºfooter
²Ë µ¥£ºmenu
²Ëµ¥ÄÚÈÝ£ºmenuContent
×Ó ²Ë µ¥£ºsubMenu
×Ӳ˵¥ÄÚÈÝ£ºsubMenuContent
ËÑ Ë÷£ºsearch
ËÑË÷¹Ø¼ü×Ö£ºkeyword
ËÑË÷·¶Î§£ºrange
±êÇ©ÎÄ×Ö£ºtagTitle
±êÇ©ÄÚÈÝ£ºtagContent
µ±Ç°±êÇ©£ºtagCurrent/currentTag
±ê¡¡ Ì⣺title
ÄÚ ÈÝ£ºcontent
ÁÐ ±í£ºlist
µ±Ç°Î»ÖãºcurrentPath
²à ±ß À¸£ºsidebar
ͼ ±ê£ºicon
×¢ ÊÍ£ºnote
µÇ ¼£ºlogin
×¢ ²á£ºregister
ÁÐ ¶¨ Ò壺column_1of3 (ÈýÁÐÖеĵÚÒ»ÁÐ)
column_2of3 (ÈýÁÐÖеĵڶþÁÐ)
column_3of3 (ÈýÁÐÖеĵÚÈýÁÐ)
¶þ¡¢idºÍclassµÄʹÓü°Çø±ð
ÎÒÃÇÖªµÀÔÚÑùʽ±í¶¨ÒåÒ»¸öÑùʽµÄʱºò£¬¿ÉÒÔ¶¨ÒåidÒ²¿ÉÒÔ¶¨Òåclass£¬ÀýÈ磺
ID·½·¨£º#test{color:#333333}£¬ÔÚÒ³ÃæÖе÷ÓÃ<div id="test">ÄÚÈÝ<div>
CLASS·½·¨£º.test{color:#333333}£¬ÔÚÒ³ÃæÖе÷ÓÃ<div class="test">ÄÚÈÝ<div>
idÒ»¸öÒ³ÃæÖ»¿ÉÒÔʹÓÃÒ»´Î£¬class¿ÉÒÔ¶à´ÎÒýÓá£
ÎÒÔÚÒ³ÃæÖÐÓÃÁ˶à¸öÏàͬidÔÚIEÖÐÏÔʾҲÕý³££¬idºÍclassºÃÏóûʲôÇø±ð£¬Óöà¸öÏàͬidÓÐʲôӰÏìÂð£¿
Ò³Ãæ´æÔÚ¶à¸öÏàͬµÄIDÓ°Ïì¾ÍÊDz»ÄÜͨ¹ýW3µÄУÑé¡£
ÔÚÒ³ÃæÏÔʾÉÏ£¬Ä¿Ç°µÄä¯ÀÀÆ÷»¹¶¼ÔÊÐíÄã·¸Õâ¸ö´íÎó£¬Óöà¸öÏàͬID“Ò»°ãÇé¿öÏ”ҲÄÜÕý³£ÏÔʾ¡£µ«Êǵ±ÄãÐèÒªÓÃJava


Ïà¹ØÎĵµ£º

cssÖÐheight:100%²»Æð×÷ÓõĽâ¾ö·½·¨

ÔÚÍøÒ³Éè¼ÆÖУ¬tableÓÃheight:100%ÊÇ¿ÉÒÔÕûÆÁµÄ£¬µ«ÐèÒªÔÚÍøҳͷ²¿Ôö¼Ó:
<!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">
ºó¾ÍºÍû ......

CSSµÄÊ®°Ë°ã¼¼ÇÉ

·­Ò룺°¢½Ý
Ô­ÎÄ×÷ÕߣºRoger Johansson
×÷Õß¼ò½é£º×¡ÔÚÈðµä¸çµÂ±¤£¬1994Ä꿪ʼ½Ó´¥ºÍ²ÎÓëwebÉè¼Æ£¬456 Berea StreetÊÇËûµÄסַ£¬Òò´Ë²ÉÓÃÕâ¸öÃû×Ö×÷ΪËûµÄ¸öÈËÖ÷Ò³ÓòÃû Ô­Îijö´¦£ºwww.456bereastreet.com
°¢½Ý˵Ã÷£º´ËÎÄÔ­Ãû"CSS tips and tricks"£¬ÓÐ2ƪ£¬ÎÒ½«ËüÃǺϲ¢·­ÒëÔÚ±¾ÎÄÖС£
±¾ÎÄ×ܽáÁËÎÒ¿ªÊ¼Ê¹ÓÃCSS²¼¾Ö· ......

CSSÈëÃÅ

       Æð³õµÄHTMLµÄÉè¼ÆÖ»ÊǶ¨ÒåÎĵµÄÚÈÝÓ㬶ø¶ÔÓÚÎĵµ²¼¾ÖÔòÓÉä¯ÀÀÆ÷À´Íê³É¡£ºóÀ´ÓÉÓÚä¯ÀÀÆ÷·þÎñÉ̲»¶ÏµØ½«ÐµĹ淶ÖУ¬Ê¹µÃ´´½¨ÎĵµÄÚHTML±êÇ©Ìí¼Óµ½HTMLÈÝÇåжÀÁ¢ÓÚ±íÏÖ²ãµÄÕ¾µãÔ½À´Ô½¸´ÔÓ¡£ÎªÁ˽â¾öÕâ¸öÎÊÌ⣬ÍòάÍøÁªÃË£¨W3C£©£¬¼ç¸ºÆðÁË HTML ±ê×¼»¯µÄʹÃü£¬²¢ÔÚ HTML 4.0 Ö®Íâ´´Ôì ......

cssʵÏÖ½¥±äЧ¹û

<div style="FILTER:alpha(opacity=30 finishopacity=0 style=1) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=1); VERTICAL-ALIGN: middle; BORDER-LEFT: #f3f3f3 1px solid; WIDTH: 300px; PADDIN ......

50¿îcss¹¤¾ß

50¿îcss¹¤¾ß
Òý×Ô:http://bbs.seuuo.com/thread-2613-1-3.html
50¿îCSS¹¤¾ß£¬°üº¬£¬CSSÍø¸ñºÍ²¼¾Ö¹¤¾ß£¬CSS ÓÅ»¯¹¤¾ß£¬CSS ²Ëµ¥Éú³É¹¤¾ß£¬CSS °´Å¥Éú³ÉÆ÷£¬CSS Ô²½ÇÉú³ÉÆ÷£¬CSS ¿ò¼Ü£¬CSS SpritesÉú³ÉÆ÷£¬CSS ÅŰ湤¾ßÒÔ¼° CSS ±íµ¥Éú³ÉÆ÷¡£
Íø¸ñºÍ²¼¾ÖThe 1KB CSS Grid
ÐÂÓ±µÄ CSS Íø¸ñ¹¤¾ß£¬¿ÉÓÃÓÚ¼ò»¯ÄÚÈݹÜÀíϵͳµÄ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØͼ | ¸ÓICP±¸09004571ºÅ