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
Ïà¹ØÎĵµ£º
.
Transparent
{
width
: 16px
;
height
: 42px
;
background
: transparent
url(images/transparent.png)
no-repeat
;
}
*
html
.
Transparent
{
&nbs ......
¡¡¡¡ÔÚWeb±ê×¼ÖеÄÒ³Ãæ²¼¾ÖÊÇʹÓÃDivÅäºÏCSSÀ´ÊµÏֵġ£ÕâÆäÖÐ×î³£Óõ½µÄ¾ÍÊÇʹÕû¸öÒ³ÃæË®Æ½¾ÓÖеÄЧ¹û£¬ÕâÊÇÔÚÒ³Ãæ²¼¾ÖÖлù±¾£¬Ò²ÊÇ×îÓ¦¸ÃÊ×ÏÈÕÆÎÕµÄ֪ʶ¡£²»¹ý£¬»¹ÊǾ³£»áÓÐÈËÎʵ½Õâ¸öÎÊÌ⣬ÔÚÕâÀïÎÒ¼òµ¥×ܽáÒ»ÏÂʹÓÃDivºÍCSSʵÏÖÒ³ÃæË®Æ½¾ÓÖеķ½·¨£º
¡¡¡¡Ò»¡¢margin:auto 0 Óë text-aligh:center
¡¡¡¡ÔÚÏÖ´úä¯ÀÀÆ÷£¨È ......
·¢ÎÄÕÂÖУ¬Í¼Æ¬°Ñdiv³ÅÆÆÁ˵Ľâ¾ö°ì·¨
ÔÀ´Í¼Æ¬×ÔÊÊÓ¦¿í¶ÈÒ»°ã¶¼ÊÇͨ¹ýJavascriptÀ´½â¾öµÄ£¬µ«ÊǶàÉÙ»¹ÊDZȽÏÂé·³¡£»¹ÓÐÒ»ÖÖͨ¹ýÉèÖÃÍâ²ãÈÝÆ÷overflow:hiddenÊôÐÔÀ´½â¾ö£¬µ«ÊÇÕâÑù»áµ¼ÖÂͼƬÏÔʾ²»È«µÄÎÊÌâ¡£½ñÌì¿´µ½ÁËÒ»ÖÖеĽâ¾ö°ì·¨£¬Í¨¹ýCSSÀ´½â¾öÕâ¸öÎÊÌâ¡£
CSS´úÂë
img{
max-width:500px;&nbs ......
/*±êÌâÔªËØ*/
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 ......