<menu id="ycqsw"></menu><nav id="ycqsw"><code id="ycqsw"></code></nav>
<dd id="ycqsw"><menu id="ycqsw"></menu></dd>
  • <nav id="ycqsw"></nav>
    <menu id="ycqsw"><strong id="ycqsw"></strong></menu>
    <xmp id="ycqsw"><nav id="ycqsw"></nav>
  • js設置字體顏色(文字顏色和內容的方法)


    JavaScript三種動態改變樣式屬性

    在JavaScript中,有兩種方式可以動態地改變樣式的屬性,一種是使用樣式的style屬性,另一種是使用樣式的className屬性。另外,控制元素的顯示和隱藏使用display屬性。

    JavaScript三種動態改變樣式屬性

    1.style 屬性

    設置style屬性語法:

    HTML元素.style.樣式屬性=”值”;

    在JavaScript中使用CSS樣式與在HTML中使用CSS稍有不同,由于在JavaScript中“-”表示減號,因此如果樣式屬性名稱中帶有“-”號,要省去“-”,并且“-”后的首字母要大寫。例如,在頁面中有一個id為titles的div,要改變div中的字體顏色為紅色,字體大小為25px,代碼如下所示:

    document.getElementById(“titles”).style.color=”#ff0000″;

    document.getElementById(“titles”).style.fontsize=”25px”;

    2.className屬性

    在HTML DOM中,className屬性可設置或返回元素的class樣式。

    設置 className屬性語法:

    HTML元素,className=”樣式名稱”;

    將上述示例中div中的字體樣式寫在樣式表中,使用className屬性來控制,代碼如下所示。

    .divStyle{color:#ff0000;font-size:25px;}

    document.getElementById(“titles”).className=”divStyle”;

    關于這兩種方式的具體使用,請參考《QlavaScript制作頁面特效》的相關視頻。

    3.display屬性

    display屬性控制元素的顯示和隱藏,取值有none(隱藏)和block(顯示)。

    設置 display屬性語法:

    HTML元素.display=”值”;

    到這里,任務8中的Tab切換效果就可以輕松完成了,自己動手試試吧。

    版權聲明:本文內容由互聯網用戶自發貢獻,該文觀點僅代表作者本人。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。如發現本站有涉嫌抄襲侵權/違法違規的內容, 請發送郵件至 舉報,一經查實,本站將立刻刪除。

    發表評論

    登錄后才能評論
    国产精品区一区二区免费