<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="關鍵字，關鍵詞">
<meta name="Description" content="描述資訊">
<title>Java 開發音樂播放器系統</title>
<style>
*{margin:0;}
.music{width:720px;height:470px;background:#ff66ff; margin:150px auto;}
/*這里不應該加上它的大哥music*/
.m_list{width:50%;height:100%;background:#cc0099;float:left;}
h2{height:60px;background:#6666cc;text-align:center;line-height:60px;font-size:20px;}
.m_con{height:410px;background:url("img/2.gif");}
.m_lrc{width:50%;height:100%;background:#ff9999;float:right;}
</style>
</head>
<body>
<div class="music">
<!--加她的的小弟-->
<div class="m_lrc"></div>
<h2>Music<h2>
<div class="m_con"></div>
<!--加它的第二個小弟-->
<div class="m_list"></div>
</div>
</body>
</html>
uj5u.com熱心網友回復：
.music{width:410px;} music寬度改成410px就行了uj5u.com熱心網友回復：
是多出來粉色部分嗎？既然不需要顯示沒必要給他寫樣式，可以把.m_list 的高度設定0再或者h2的高度變成30，還有你的布局 建議一個大盒子 套兩個小盒子 左邊一個 右邊一個 在左邊的盒子里接著寫 你先在的布局不如添加點擊事件，點擊右側的粉色部分也會觸發頭部/圖片的事件的
uj5u.com熱心網友回復：
你那里多出來，那是因為你設定了.m_list樣式引起的，你竟然不想它顯示出來，那你可以不給它設定樣式屬性呀PS：注意代碼撰寫規范
uj5u.com熱心網友回復：
.music {
width: 720px;
height: 470px;
background: #ff66ff;
margin: 150px auto;
overflow: hidden;
}
對布局不是很理解的話，直接在容器上加溢位隱藏overflow:hidden;
uj5u.com熱心網友回復：
首先，你代碼有錯，h2標簽結束少了個斜杠。其次，.m_lrc右浮動了，所以左邊默認向下排序。轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/91226.html
標籤：HTML5