CSS，爲什麼一件事情可以工作，而不是另一件事情？

爲什麼這個工作：CSS，爲什麼一件事情可以工作，而不是另一件事情？

<div style="background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px;">testing 10,9,8,7 
</div>

這不？

<div style="roundedCornerBox"> 
    testing 10,9,8,7 
</div>

當我創建了一個CSS文件，上面寫着：

body { 
    background-color: #FFFFFF; 
    text-align: center; 
} 

roundedCornerBox { 
    background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px; 
}

這裏是我的HTML代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head><title></title> 
    <link rel="stylesheet" href="lib/css/style.css" />  
</head> 

<body> 
<div style="roundedCornerBox"> 
    testing 10,9,8,7 
</div> 

<div style="background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px;"> 
     testing 10,9,8,7 
</div> 
</body> 
</html>

來源

2010-03-01 ML.

您確實不意味：

<div class="roundedCornerBox"> 
    testing 10,9,8,7 
</div>

和

.roundedCornerBox { 
    background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px; 
}

您需要的點來識別一個CSS類和使用CSS類，你需要將類名的dom元素的類屬性。

來源

2010-03-01 23:47:45

http://www.w3.org/TR/REC-html40/present/styles.html#adef-style 樣式屬性的定義。較少的技術和再次有用的w3schools細分的差異：http://www.w3schools.com/CSS/css_howto.asp – Kzqai 2010-03-01 23:50:46

類開始以點！

.roundedCornerBox { 
    background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px; 
} 

<div class="roundedCornerBox">

沒有點，它正在尋找<roundedCornerBox />元素的樣式。 style=也需要爲class=。

來源

2010-03-01 23:46:34

仍然無法工作。仔細檢查他的代碼。他將類名放在style屬性中。 – 2010-03-01 23:48:32

@DN - 我也有這個修正... – 2010-03-01 23:48:53

@Tchalvak - 公平點，更新更明確。 – 2010-03-01 23:49:35

您想在標記中使用class="roundedCornerBox"，在CSS中使用.roundedCornerBox。

來源

2010-03-01 23:47:08

div標記在您的第二個示例中不正確。這可能是

<div id="roundedCornerBox"> 
    testing 10,9,8,7 
</div>

和

#roundedCornerBox { 
    background-color: #ccc; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #000; 
    padding: 10px; 
}

來源

2010-03-01 23:48:16

他只是忘了'.';） – casraf 2010-03-02 00:04:54

這就是說，如果'roundedCornerBox'是一個'class '。另一個語法正確的選項是使其成爲'id'。（*語義*，或許作爲'class'更好。無論如何。） – 2010-03-02 01:20:15

CSS，爲什麼一件事情可以工作，而不是另一件事情？

回答

相關問題