¡¾DIV+CSSÈëÃŽ̡̳¿ËÄ¡¢CSSÈçºÎ¿ØÖÆÒ³Ãæ
±¾½ÚÖ÷Òª½²½â£¬Á½¸öÄÚÈÝ£¬
µÚÒ»£ºCSS
ÈçºÎ¿ØÖÆÒ³ÃæÑùʽ£¬ÓÐ
¼¸ÖÖ·½Ê½£»
µÚ¶þ£ºÕâЩ·½Ê½³öÏÖÔÚͬһ¸öÒ³ÃæʱµÄÓÅÏȼ¶¡£
ʹÓÃxHTML
+CSS
²¼¾ÖÒ³Ã棬ÆäÖÐÓиöºÜÖØÒªµÄÌصã¾ÍÊÇÄÚÈÝÓë±íÏóÏà·ÖÀ룬ÄÚÈÝÖ¸HTMLÒ³Ãæ´úÂ룬±íÏó¾ÍÊÇCSS´úÂëÁË£¬Èç¹û°ÑÒ³Ãæ¿´³É´©×ÅÒ·þµÄÈ˵Ļ°£¬È˾ÍÊÇ
HTML£¬ÊÇÄÚÈÝ£¬¶øÒ·þÄؾÍÊÇCSS£¬ÊDZí
Ïó£¬ÏÖÔÚ³öÏÖµÄÎÊÌâÊÇ£¬ÈçºÎÈÃCSSÈ¥¿ØÖÆÒ³Ã棿»òÕß˵£¬ÈçºÎÈÃÒ·þ´©ÔÚÈËÉíÉÏ£¬ºÃÌåÏÖ³öÈ˵÷ç¸ñÌØ
µã£»²»Í¬µÄCSS¾Í¿ÉÒÔʹҳÃæ³öÏÖ²»Í¬µÄ·ç¸ñÊÊÓò»Í¬µÄÍøÕ¾£¬¶ø²»Í¬µÄÒ·þ£¬ÈË´©ÉϺó¾Í»áÌåÏÖ
³ö²»Í¬µÄÖ°Òµ¡£
µÚÒ»£ºÈçºÎÈÃCSSÈ¥¿ØÖÆHTMLÒ³ÃæЧ¹ûÄØ£¿
ÓÐ
Õâô4ÖÖ·½Ê½£¬ÐÐÄÚ·½Ê½¡¢ÄÚǶ·½Ê½¡¢Á´½Ó·½Ê½¡¢µ¼È뷽ʽ
1£©ÐÐÄÚ·½Ê½
ÐÐÄÚ·½Ê½ÊÇ4ÖÖÑùʽÖÐ×îÖ±½Ó×î¼òµ¥µÄÒ»ÖÖ£¬Ö±½Ó¶ÔHTML±êÇ©ÊÊÓÃstyle=""£¬ÀýÈ磺
<p style="color:#F00; background:#CCC;
font-size:12px;"></p>
ËäÈ»ÕâÖÖ·½·¨±È½ÏÖ±½Ó£¬ÔÚÖÆ×÷Ò³ÃæµÄʱºòÐèҪΪºÜ¶àµÄ±êÇ©ÉèÖÃstyleÊôÐÔ£¬ËùÒԻᵼÖÂHTMLÒ³Ãæ²»¹»´¿¾»£¬ÎļþÌå»ý¹ý´ó£¬²»ÀûÓÚËÑË÷Ö©ÖëÅÀÐУ¬´Ó¶ø
µ¼ÖºóÆÚά»¤³É±¾¸ß¡£
2£©ÄÚǶ·½Ê½
ÄÚǶ·½Ê½¾ÍÊǽ«CSS´úÂëдÔÚ<head></head>Ö®¼ä£¬²¢ÇÒÓÃ<style><
/style>½øÐÐÉùÃ÷£¬ÀýÈ磺
<!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>ÎÞ±êÌâÎĵµ</title>
<style type="text/css">
<!--
#div1{width:64px; height:64px; float:left;}
#div1 img{width:64px; height:64px;}
-->
</style>
</head>
<body>
<div id="div1"><img
src="http://www.cssxuexi.cn/index/images/ico/2days.gif"
/></div>
È«¹úµÄCSS°®ºÃÕß»ã¾ÛÓÚ´Ë£¬Èç¹û²»À´£¬Äã¾ÍOUTà¶~ÎÒÃǵĿںÅÊÇ£º
“·ÖÏí×Ô¼ºµÄ»¶ÀÖÓëÍ´¿à£¬·ÖÏí×Ô¼ºµÄ¾ÑéÓëÐĵ㬷ÖÏí×Ô¼ºµÄ×ÊÁÏÓë×ÊÔ´”
Èç¹ûÄúÒ²Ô¸Ò⣬¾Í¼ÓÈëÎÒÃÇ°É~
</bo
Ïà¹ØÎĵµ£º
±ÈÈçÒª·Ö±æIE6ºÍfirefoxÁ½ÖÖä¯ÀÀÆ÷£¬¿ÉÒÔÕâÑùд£º
¡¡¡¡<style>
¡¡¡¡div{
¡¡¡¡background:green; /* for firefox */
¡¡¡¡*background:red; /* for IE6 */
¡¡¡¡}
¡¡¡¡</style>
¡¡¡¡ÎÒÔÚIE6Öп´µ½ÊǺìÉ«µÄ£¬ÔÚfirefoxÖп´µ½ÊÇÂÌÉ«µÄ¡£
¡¡¡¡½âÊÍһϣº
¡¡¡¡ÉÏÃæµÄcssÔÚfirefoxÖУ¬ËüÊÇÈÏʶ²»Á˺óÃæµÄÄǸö´ ......
Ò³ÃæÉϵÄcssÁ´½Ó ÈçÏÂ
<link href="../style/style.css" rel="stylesheet" type="text/css" />
µ±a.actionͨ¹ýÖض¨Ïòredirect µ½ÁíÒ»¸öb.actionºó£¬½øÈëÏÂÒ»¸öjspÒ³Ã棬´ËʱcssºÍÒ³ÃæµÄͼƬ¶¼Ê§Ð§¡£
ºóÀ´°ÑjspÀïÃæµÄcss·¾¶¡¢Í¼Æ¬Â·¾¶¸ÄΪ¾ø¶Ô·¾¶£¬¾Í°ÑÎÊÌâ½á¾ÖÁË¡£
<link href="/BookShop/style/style.css" ......
Çø±ðspan div p Èý¸ö±êÇ©µÄÓ÷¨
spanºÍdivµÄ²»Í¬Ö®´¦ÔÚÓÚspanÊÇÄÚÁªµÄ£¬ÓÃÔÚһС¿éµÄÄÚÁªHTMLÖУ¬Ç°ºó²»¶ÏÐÐ.
divÔªËØÊǿ鼶µÄ£¨¼òµ¥µØ˵£¬ËüµÈͬÓÚÆäÇ°ºóÓжÏÐУ©£¬ÓÃÓÚ×éºÏÒ»´ó¿éµÄ´úÂë¡£
p(¶ÎÂä)ÔªËØÊǿ鼶µÄ,Ç°ºó¶ÏÐÐ,¶øÇÒ»¹ÒªÔÙ¸ôÒ»ÐÐ.Ï൱ÓÚ¶ÏÁ½ÐÐ.
<div> ¿É¶¨ÒåÎĵµÖеķÖÇø»ò½Ú£¨division ......