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

¡¾DIV+CSSÈëÃŽ̡̳¿Îå¡¢CSSÑ¡ÔñÆ÷

ÉϽڿÎÎÒÃǽ²ÁËÒ»ÏÂCssͨ¹ýʲô·½Ê½È¥¿ØÖÆÒ³Ãæ
£¬Èç¹û²»¼ÇµÃ£¬ÎÒÀ´°ï´ó¼Ò»ØÒäһϣ¬×ܹ²ÓÐËÄÖÖ·½Ê½ÐÐÄÚ·½Ê½¡¢ÄÚ
Ƕ·½Ê½¡¢Á´½Ó·½Ê½¡¢µ¼È뷽ʽ£¬´ó¼Òͨ¹ýÕâËÄÖÖ·½Ê½¾Í¿ÉÒÔʵÏÖCSS
¶ÔHTML
Ò³ÃæÑùʽµÄ¿ØÖÆ£¬Èç¹ûÒªÈÃÕâЩÑùʽ¶ÔHTMLÒ³ÃæÖеÄÔªËØʵÏÖÒ»¶ÔÒ»£¬Ò»¶Ô¶à»òÕ߶à¶ÔÒ»µÄ¿ØÖÆ£¬Õâ¾ÍÐè
ÒªÓõ½CSSÑ¡ÔñÆ÷£¬HTMLÒ³ÃæÖеÄÔªËؾÍÊÇͨ¹ýCSSÑ¡ÔñÆ÷½øÐпØÖƵġ£
CSSÑ¡ÔñÆ÷¹²ÓÐÈýÖÖ£º±êÇ©Ñ¡ÔñÆ÷
¡¢ID
Ñ¡ÔñÆ÷
¡¢ÀàÑ¡ÔñÆ÷
¡£
ΪÁ˺óÃæµÄ¶ÔÑ¡ÔñÆ÷µÄ½âÊ͸üÈÝÒ×Àí½â£¬ÔÚÕâÀïÏÈ´ò¸ö±ÈÓ÷£¬Èç¹û°ÑÄãËù´¦µÄ»·¾³ÊÓΪHTMLÒ³ÃæµÄ»°£¬»·¾³ÀïµÄÿһ¸öÈËÔòÏ൱ÓÚHTMLÒ³ÃæÄÚ±êÇ©ÔªËØ£¬Ã¿
¸öÈ˶¼ÓÐÒ»¸öID(Éí·ÝÖ¤)£¬ÄÇôhtmlÖеÄÿһ¸ö±êÇ©Ò²¶¼ÓÐ×Ô¼ºµÄID£¬´ó¼Ò¶¼ÖªµÀIDÊÇΨһµÄ£¬²»¿ÉÄÜÖظ´¡£
¡¾±êÇ©Ñ¡ÔñÆ÷¡¿
Ò»¸öÍêÕûµÄHTMLÒ³ÃæÊÇÓÐ
ºÜ¶à²»Í¬µÄ±êÇ©×é³É£¬¶ø±êÇ©Ñ¡ÔñÆ÷£¬ÔòÊǾö¶¨ÄÄЩ±êÇ©²ÉÓÃÏàÓ¦µÄCSSÑùʽ£¬(ÔÚ´ó»·¾³ÖÐÄã¿ÉÄܳöÓÚ²»Í¬µÄλÖ㬵«ÊDz»¹ÜÔõôÑù£¬Äã×ÜÊÇ´©×ÅͬһÌ×Ò·þ£¬
Õâ¼þÒ·þ¾ÍÊÇÓɱêÇ©Ñ¡ÔñÆ÷ÊÂÏȸøÄãÏÞ¶¨ºÃµÄ£¬²»¹Ü×ßµ½ÄÄÀﶼÊÇÕâÉíÒ·þ)±ÈÈ磬ÔÚstyle.cssÎļþÖжÔp±êÇ©ÑùʽµÄÉùÃ÷ÈçÏ£º
p{
font-size:12px;
background:#900;
color:090;
}
ÔòÒ³ÃæÖÐËùÓÐp±êÇ©µÄ±³¾°¶¼ÊÇ#900(ºìÉ«)£¬ÎÄ×Ö´óС¾ùÊÇ12px£¬ÑÕɫΪ#090(ÂÌÉ«)£¬ÕâÔÚºóÆÚά»¤ÖУ¬Èç¹ûÏë¸Ä±äÕû¸öÍøÕ¾ÖÐp±êÇ©±³¾°µÄÑÕ
É«£¬Ö»ÐèÒªÐÞ¸ÄbackgroundÊôÐԾͿÉÒÔÁË£¬¾ÍÕâôÈÝÒ×£¡
¡¾IDÑ¡ÔñÆ÷¡¿
IDÑ¡ÔñÆ÷ÔÚijһ¸öHTML
Ò³ÃæÖÐÖ»ÄÜʹÓÃÒ»´Î(µ±È»Ò²¿ÉÒÔÓúü¸´Î£¬²»¹ý¾Í²»·ûºÏW3C±ê×¼ÁË£¬ÄÇÒ³ÃæÒ²¾Í²»ÊDZê×¼Ò³Ãæà¶~£¬ÔÛÃǵÄÄ¿µÄ²»¾ÍÊÇΪÁË×ö±ê×¼µÄÒ³Ãæô£¬ËùÒÔ½¨Òé´ó¼Ò²»
ÒªÔÚͬһ¸öhtmlÒ³ÃæÖжà¸ö±êÇ©ÓµÓй²Í¬µÄID)£¬¾ÍÏñÔÚÄãËù´¦µÄ»·¾³ÖУ¬ÄãÖ»ÓÐÒ»¸öID(Éí·ÝÖ¤)£¬²»¿ÉÄÜÖظ´£¡ÏàÐÅ´ó¼ÒÒ²ÄÜ¿´³öÀ´£¬IDÑ¡ÔñÆ÷¸ü¾ß
ÓÐÕë¶ÔÐÔ£¬È磺
Ïȸøij¸öHTMLÒ³ÃæÖеÄij¸öp±êÇ©Æð¸öID£¬´úÂëÈçÏ£º
<p id="one">´Ë´¦Îªp±êÇ©ÄÚµÄÎÄ×Ö</p>
ÔÚCSSÖж¨ÒåIDΪoneµÄp±êÇ©µÄÊôÐÔ£¬¾ÍÐèÒªÓõ½#£¬´úÂëÈçÏ£º
#one{
font-size:12px;
background:#900;
color:090;
}
ÕâÑùÒ³ÃæÖеÄij¸öp¾Í»áÊÇCSSÖж¨ÒåµÄÑùʽ¡£
¡¾ÀàÑ¡ÔñÆ÷¡¿
ÕâÖÖÑ¡ÔñÆ÷¸üÈÝÒ×Àí½âÁË£¬¾ÍÊÇ
ʹҳÃæÖеÄijЩ±êÇ©(¿ÉÒÔÊDz»Í¬µÄ±êÇ©)¾ßÓÐÏàͬµÄÑùʽ£¬¾ÍÏñ¹úÇìÖÐij¸ö·½ÕóÖУ¬¿Ï¶¨¶¼ÊDz»Í¬µÄÈË£¬È´¾ù´©ºìÉ«Ò·þ£¬ÊÖÖи߾ٻ¨»·£¬Ñùʽ¶¼ÊÇÒ»ÑùµÄ£¬Èç¹û
ÏëÈÃÕâÒ»ÀàÈ˶¼Óй²Í¬µÄÑùʽ£¬¸ÃÔõô×öÄØ~ºÇºÇ£¬ºÍIDÑ¡ÔñÆ÷µÄÓ


Ïà¹ØÎĵµ£º

10¸ö½ÚÔ¼¿ª·¢Ê±¼äµÄCSS¼¼ÇÉ

CSSÒѾ­³ÉΪÍøҳǰ¶ÎÉè¼ÆÒ»¸ö·Ç³£ÖØÒªµÄ²¿·Ö£¬ÓÉÓÚдCSSʱÐèÒª¿¼ÂǵÄÎÊÌâ·Ç³£¶à£¬ÀÏÊÖÃÇ´´½¨ÐÂÒ³ÃæÊÇͨ³£»áÑØÓÃÒÔÇ°µÄCSS¿ò¼Ü¡£µ«ÊÇÐÂÊÖûÓÐ×Ô¼ºµÄ¿ò¼Ü£¬ÕâƪÎÄÕ¿ÉÒÔ¸øÐÂÊÖÃÇһЩÆôʾ¡£
1.¼òµ¥µÄ´¿CSS Tooltip
ͨ¹ýÕâЩ´úÂ룬Äã¿ÉÒÔ×ö³ö¼òµ¥µÄTooltip¡£ÕâÊÇCSS
´úÂ룺
ÒÔÏÂΪÒýÓõÄÄÚÈÝ£º
a:hover { background: ......

cssÔÚ²»Í¬ä¯ÀÀÆ÷ÖеÄд·¨

±ÈÈçÒª·Ö±æIE6ºÍfirefoxÁ½ÖÖä¯ÀÀÆ÷£¬¿ÉÒÔÕâÑùд£º
¡¡¡¡<style>
¡¡¡¡div{
¡¡¡¡background:green; /* for firefox */
¡¡¡¡*background:red; /* for IE6 */
¡¡¡¡}
¡¡¡¡</style>
¡¡¡¡ÎÒÔÚIE6Öп´µ½ÊǺìÉ«µÄ£¬ÔÚfirefoxÖп´µ½ÊÇÂÌÉ«µÄ¡£
¡¡¡¡½âÊÍһϣº
¡¡¡¡ÉÏÃæµÄcssÔÚfirefoxÖУ¬ËüÊÇÈÏʶ²»Á˺óÃæµÄÄǸö´ ......

yuiѧϰ±Ê¼Ç£¨¶þ£© ʹÓÃcss¹¤¾ß±£³ÖÒ»ÖÂÐÔ

Ëĸöcss¹¤¾ß£ºfonts,grids,reset,base
ʹԪËرê×¼»¯µÄreset.css
ÒÔÏÂÆÕͨ¶ø³£ÓõÄÔªËض¼½«marginºÍpaddingÖµ±ê×¼»¯µ½0
the document body
div and p 
ËùÓÐlist ÔªËØ£ºdl,dt,dd,ul,ol,li
±êÌ⼶ԪËØ£ºh1,h2,h3,h4,h5,h6
preºÍblockquoteÔªËØ
ijЩ±íµ¥ÔªËØ£ºform,fieldset,input,textarea
tableÔªËØ£ºt ......

×îºÃµÄcssÖØд´úÂë

Eric Meyer’s CSS Reset
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, fo ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØͼ | ¸ÓICP±¸09004571ºÅ