好站: CSS 屬性 與 JavaScript 對應 轉換表

CSS 的屬性值 和 JavaScript 設定 CSS 屬性值 的命名規則上有點差異, 簡單的說, 大多數的差異, 都是 CSS 屬性有 -: 號的, 就是去掉 -:, 後面接的字轉大寫, ex:

  • background-color => backgroundColor
  • background-image => backgroundImage
  • background-position => backgroundPosition
  • background-repeat => backgroundRepeat
  • text-decoration: line-through => textDecorationLineThrough
  • text-decoration: none => textDecorationNone
  • 要注意的例外狀況是: float => styleFloat 這個.

CSS 屬性 與 JavaScript 的轉換對照表

另外若有使用 jQuery 的, 雖然 jQuery 幫我們做很多簡化, 不過 .css() 這個方法, 還是照這個規則走(本來是希望可以 'background-color' 設. XD), 這個對照表還是記起來比較好~ .css 的方法是照這個規則走, 如果要使用 'background-color', 要用 " 括起來.

  • jQuery 使用範例:
  • $("a").css({backgroundColor:"yellow", fontWeight:"bolder"});
  • $("a").css({"background-color": "yellow", "font-weight": "bolder"});

相關網頁

作者: Tsung

對新奇的事物都很有興趣, 喜歡簡單的東西, 過簡單的生活.

在〈好站: CSS 屬性 與 JavaScript 對應 轉換表〉中有 2 則留言

  1. 其實 jQuery.css() 可以辦的到...
    $("a").css({
    "background-color": "yellow",
    "font-weight": "bolder"
    });
    使用有屬性裡面出現 - 符號的時候, 前後加上引號就可以了...

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料