相同的DIV兩次不同的花車？

我試圖清理我的代碼有點沒有這麼多div ID的。據我瞭解，你不應該多次使用相同的div id。相同的DIV兩次不同的花車？

的HTML：

<div id="sides" class="alignLeft"></div> 
<div id="sides" class="alignRight"></div> 
<div id="center"></div><!--center-->

的CSS：

.alignLeft { 
    float: left; 
} 
.alignRight { 
    float: right; 
} 
#sides { 
    width: 350px; 
    height: 45px; 
} 
#center { 
    width: 350px; 
    height:350px; 
}

正如你可以看到我已經使用了#sides格設置兩次在HTML，但採用了不同的浮動類（左，右）。儘管代碼似乎有效，但我知道這是不正確的。什麼是正確的方式來使用不同的浮動相同的div？

來源

2012-07-12 Matt C

結束標記在所有的'align'應該是'}' – Bob 2012-07-12 19:52:19

是的ID選擇器只能用於每頁一次。你可以重構你的代碼看起來像這樣。

HTML

<div class="sides alignLeft"></div> 
<div class="sides alignRight"></div> 
<div id="center"></div><!--center-->

CSS

.alignLeft { 
    float: left; 
} 
.alignRight { 
    float: right; 
{ 
.sides { 
    width: 350px; 
    height: 45px; 
} 
#center { 
    width: 350px; 
    height:350px; 
}

來源

2012-07-12 19:49:21 brezanac

先生，你2秒+1打我爲你:) – 2012-07-12 19:50:46

您可以分配多個類給一個元素，所以你可以使用sides爲一類，而不是一個id：

HTML：

<div class="sides alignLeft"></div> 
<div class="sides alignRight"></div> 
<div id="center"></div><!--center-->

的CSS：

.alignLeft { 
    float: left; 
{ 
.alignRight { 
    float: right; 
{ 
.sides { 
    width: 350px; 
    height: 45px; 
} 
#center { 
    width: 350px; 
    height:350px; 
{

來源

2012-07-12 19:49:43

謝謝holodoc和Forte大號的作品大。 – 2012-07-12 20:10:00

相同的DIV兩次不同的花車？

回答

相關問題