實例作品
<html>
<head>
<title>左中右</title>
<style>
<!--
body{
margin:0px; padding:0px;
font-family:arial;
color:#060;
background-color:#DDDDDD;
}
#left{
position:absolute;
top:0px;
left:0px;
margin:0px;
background:#cce9ff;
width:190px; /* 固定寬度 */
}
#middle{
padding:10px;
background:#ffffff;
margin:0px 190px 0px 190px; /* 左右空190px */
margin-top:0px;
}
#right{
position:absolute;
top:0px;
right:0px;
margin:0px;
background:#cce9ff;
width:190px; /* 固定寬度 */
}
p{
font-size:12px;
line-height:22px;
margin:20px 0px 10px 0px;
padding:10px;
}
pre{
font-size:12px;
line-height:20px;
margin:20px 0px 10px 0px;
font-family:arial;
}
-->
</style>
</head>
<body>
<div id="left">
<p>left</p>
</div>
<div id="middle">
<pre>
body{
margin:0px; padding:0px;
font-family:arial;
color:#060;
background-color:#CCC;
}
#left{
position:absolute;
top:0px;
left:0px;
margin:0px;
background:#FFF;
width:190px;/* 固定寬度 */
}
#middle{
padding:10px;
background:#FFF;
margin:0px 190px 0px 190px;/* 左右空190px */
margin-top:0px;
}
#right{
position:absolute;
top:0px;
right:0px;
margin:0px;
background:#FFF;
width:190px;/* 固定寬度 */
}
p{
font-size:12px;
line-height:22px;
margin:20px 0px 10px 0px;
padding:10px;
}
pre{
font-size:12px;
line-height:20px;
margin:20px 0px 10px 0px;
font-family:arial;
}
</pre>
</div>
<div id="right">
<p>right</p>
</div>
</body>
</html>
掃一掃關(guān)注官方微信建站百科 聯(lián)系我們 網(wǎng)站備案 網(wǎng)站地圖
友情鏈接： 營銷型網(wǎng)站建設(shè) 湘潭網(wǎng)絡(luò)推廣
版權(quán)所有：湖南優(yōu)度網(wǎng)絡(luò)科技有限公司 備案號：湘ICP備2025103864號
