css³£Óò¼¾ÖÑùʽ
1.Ò»ÐÐÈýÁÐ
<!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" lang="gb2312">
<head><title>css²¼¾Ö£ºÒ»ÐÐÈýÁÐ</title>
<link rel="stylesheet" href="css/03_3columnplustopbox.css" mce_href="css/03_3columnplustopbox.css" type="text/css" media="all" />
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<meta name="robots" content="all" />
<meta name="author" content="Owen Briggs:www.w3cn.org" />
</head><body>
<div id="top">
<p>top</p>
</div>
<div id="left">
<p>left</p>
</div>
<div id="middle">
<pre>
#top {
margin: 20px 20px 0px 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
height: 100px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
height: 70px;
}
html>body #top {
height: 70px; /* ie5win fudge ends */
}
#left {
position: absolute;
top: 120px;
left: 0px;
margin: 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
width: 150px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
width: 120px;
}
html>body #left {
width: 120px; /* ie5win fudge ends */
}
#middle {
margin: 20px 190px 20px 190px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
}
#right {
position: absolute;
top: 120px;
right: 0px; /* Opera5.02 will show a space
at right when there is no scroll bar */
margin: 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
width: 150px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
width: 120px;
}
html>body #right {
width: 120px; /* ie5win fudge ends */
}
</pre>
<div align="right"><p><a href="css/03_3columnplustopbox.css" mce_h
Ïà¹ØÎĵµ£º
CSS ºÐÄ£ÐÍ
¡¡¡¡ÍøÒ³Éè¼ÆÖеÄÿ¸öÔªËض¼Êdz¤·½ÐεĺÐ×Ó¡£ºÐ×ӵijߴçÊÇÔõÑù¾«È·¼ÆËãµÄ£¬Çë¿´ÏÂͼ£º
¡¡¡¡
¡¡¡¡Èç¹ûÊÇ Firebug Óû§µÄ»°(»ù±¾ºÍÇ°¶ËÓйصĶ¼»áÓõ½ Firebug °É – ÌÇ°éÎ÷ºìÊÁ)£¬¾Í»áºÜÊìϤÏÂÃæµÄͼ±íÁË¡£
¡¡¡¡Õâ¸öͼ±íºÜºÃµØչʾÁË×÷ÓÃÓÚÒ³ÃæÉÏÈÎÒâºÐ×ÓµÄÊýÖµ¡£
¡¡¡¡
¡¡¡¡×¢ÒâÒÔÉÏÁ½¸öÀý×ÓÖУ¬margi ......
Internet Explorer 8Ô¤ÉèÊÇÒÔCSS 2.1Ϊ±ê×¼£¬²¢ÐÞÕýÁËÐí¶àInternet Explorer 7µÄCSS Bug£¬ÕâÒâζ×ÅÓÐÒ»²¿·ÝÒÔÍùÒÀ¾ÝIE 7ËùÉè¼ÆµÄÍøÒ³£¬
ÔÚIE 8ÉϵijÊÏÖ»áÓÐËù³öÈ룬ËùÐÒ°ÝIE 7ÏàÈݼìÊÓ¹¦ÄÜËù´Í£¬Ä¿Ç°ÒòʹÓÃIE 8¶øµ¼Ö°æÃæ´íÎóµÄÍøÕ¾²¢²»¶à¡£
µ«Ò»ÖµÒÀÀµIE 7ÏàÈݼìÊÓ¹¦Äܲ¢·Ç³¤¾ÃÖ®¼Æ£¬¾¡Ô罫ÍøÕ¾ÐÞ¸ÄΪIE 8ÏàÈݲÅÊdz¤¾Ã ......
×÷Ϊһ¸ö³ÌÐòÔ±£¬¾³£ÐèÒªÃæ¶ÔµÄÒ»¸öÎÊÌâ¾ÍÊÇÔÚÐÂÎŵÈÐÅÏ¢µÄ±êÌâÁбíÖУ¬³£³£ÎªÁËÊÊÓ¦±í¸ñµÄ¿í¶È£¬ÐèÒª¶Ô¹ý³¤µÄ±êÌâÎÄ×ֵĽøÐнØÈ¡²¢ÔÚ½ØÈ¡ºóµÄÎÄ×ÖÄ©¶Ë¼ÓÉÏÊ¡ÂԺš£
ÖÚËùÖÜÖª£¬Óкܶ෽·¨¿ÉÒÔʵÏÖÕâ¸ö¹¦ÄÜ£¬JavaScript£¬ASP£¬PHP¶¼Óи÷×ÔµÄʵÏÖ·½·¨£¬µ«ÊÇÃæÁÙµÄÎÊÌâÓкܶ࣬±ÈÈçÖÐÓ¢ÎÄ»ìÔÓʱ»òÔÚijЩ±àÂëÏ£¬ÈÝÒ×Ôì³É½ØÈ ......
TABLE{
BORDER-RIGHT: #888 1px solid;
BORDER-TOP: #888 1px solid;
MARGIN-TOP: 10px;
BORDER-LEFT: #888 1px solid;
WIDTH: 100%;
BORDER-BOTTOM: #888 1px solid;
FONT-FAMILY: Arial, Helvetica, sans-serif;
BORDER-COLLAPSE: collapse;
}
TABLE PRE {
BORDER-TOP-WIDTH: 0px;
PADDING-RIGHT: 0px;
PA ......