CSS：爲什麼設置margin-top只能在Webkit中工作？

Here is a test case/live example.總結的問題：CSS：爲什麼設置margin-top只能在Webkit中工作？

WebKit中這僅適用於：

Y.one('#container').setStyle('margin-top', 100);

這適用於所有的瀏覽器：

Y.one('#container').setStyle('margin', 100);

爲什麼設置的margin-top僅工作在WebKit的？

編輯：修復程序顯示在下面的答案之一。你需要在這裏有marginTop，然後才能工作。所以，編輯的問題是，爲什麼在這種情況下你需要marginTop而不是margin-top？

來源

2010-08-12 Jaanus

這是爲我工作在Firefox：

<div id="nav"> 
<a href='#' onclick='document.getElementById("nav").style.marginTop="25px";'>test</a> 
</div>

來源

2010-08-12 23:25:10 Robert

我也可以確認IE。 – Robert 2010-08-12 23:26:19

這幾乎是答案。我還想要一些W3C參考或者指向這個marginTop vs margin-top的東西。任何人？ :) – Jaanus 2010-08-12 23:27:57

http://www.w3schools.com/css/pr_margin-top.asp 向下滾動，它告訴你訪問與JavaScript爲「object.style.marginTop =」10px「 – Robert 2010-08-12 23:29:57

它必須marginTop，因爲你不是在一個CSS文件中設置一個CSS屬性。您正在設置style對象的marginTop屬性。 -是標識符的無效字符。

來源

2010-08-12 23:39:44 Strelok

所以唯一的祕密是，它爲什麼與Webkit一起工作？ – Jaanus 2010-08-12 23:42:32

如果您正在訪問style屬性，則應用駝峯案例by the standard。所以如果webkit支持像element.style["margin-top"]那樣的話，那麼這是一個怪癖。請記住，您不是直接處理CSS，而只是一箇中間層。

總之 - marginTop是CSS2Properties接口的一部分，但margin-top不是。

一些圖書館傾向於自動轉換屬性名稱，即將所有hyphenized屬性名稱轉換爲camel case形式的Prototype，因此您不必擔心它。

來源

2010-08-15 12:10:53 Andris

我沒有知道爲什麼camel case是唯一的方式（因爲它完全可能，已經被WebKit證明），至少我沒有提及*官方來源* Flanagan的* JavaScript權威指南*（第372頁）指出 - 許多CSS樣式屬性（如font-family）在其名稱中包含連字符。在JavaScript中，連字符被解釋爲一個負號，所以不可能寫出像'element.style.font-family =「sans-serif」[']這樣的表達式，屬性名是通過刪除連字符並立即在每個連字符後面加上大寫字母。 – Andris 2010-08-15 12:45:18

CSS：爲什麼設置margin-top只能在Webkit中工作？

回答

相關問題