css三列布局
<!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=utf-8" />
<title>三列布局</title>
<style type="text/css">
body{ margin:0; padding:0; font-size:30px; font-weight:bold}
div{ line-height:50px}
.left{ width:200px; height:600px; background:#ccc;position:absolute; left:0; top:0}
.main{ height:600px;margin:0 310px 210px;background:#9CF}
.right{ height:600px; width:300px; position:absolute; top:0;right:0; background:#FCC;}
</style>
</head>
<body>
? ??
? ? <div class="left">left</div>
? ? <div class="main">設計首頁的第一步是設計版面布局。就象傳統的報刊雜志編輯一樣，我們將網頁看作一張報紙，一本雜志來進行排版布局。 雖然動態網頁技術的發展使得我們開始趨向于學習場景編劇，但是固定的網頁版面設計基礎依然是必須學習和掌握的。它們的基本原理是共通的，你可以領會要點，舉一反三。</div>
? ? <div class="right">right</div>
</body>
</html>
這是我的代碼，我覺得好像沒有問題，左右都設置了絕對定位，main的margin值也沒有問題，為什么呈現的樣式里面，左邊塊和中間塊之間有很大間隔，我在別的瀏覽器打開也是這樣，當我把左邊塊寬度200px設置為和右邊一樣的300px時，最后呈現的格式就對了，改成200px又不對了，實在太小白了，出了問題完全不知道怎么回事，希望大家幫幫忙
2016-08-24
.main{ height:600px;margin:0 310px 210px;background:#9CF}這句話里面少了一個0吧，在310px和210px中間應該加個0，????“.main{ height:600px;margin:0 310px 0 210px;background:#9CF}”
2016-08-24
main{ height:600px;margin:0 310px 210px;background:#9CF} ?代碼里的margin值設置錯了 ? 應該是margin:0 310px 0 210px ?你省略了一個0就變成了上0 左右310px 下210px ?所以顯示出的結果2個塊中間的間距就不一樣大了。