首頁 >web前端 >js教程 >jq如何改變css樣式

jq如何改變css樣式

醉折花枝作酒筹
醉折花枝作酒筹原創
2021-04-21 13:40:555144瀏覽

在jquery中,可以使用css()方法改變樣式,語法格式為「$("元素名稱").css("屬性名稱","屬性值")」;css()方法設定或傳回被選元素的一個或多個樣式屬性,為所有符合元素設定指定CSS屬性。

jq如何改變css樣式

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

引jQuery,然後定義元素的style樣式,依照自己的元素來定義,這裡隨性定義div的style樣式。

jq如何改變css樣式

接著我們看樣式所帶來的效果,接著開始設定點擊按鈕會產生變化顏色等互動效果。

jq如何改變css樣式

首先,自然是指定好觸發變化顏色的事件,可以是經過觸發等,這裡我就點擊即可觸發顏色變化。

jq如何改變css樣式

如圖,用css()便可以覆寫原來元素的樣式了哦。

jq如何改變css樣式

如果是修改元素單一樣式,要用逗號隔開,不可以使用冒號哦。

jq如何改變css樣式

這樣就可以得到互動效果了,但是這只是一個樣式的效果發生了變化,多個效果怎麼做呢?

jq如何改變css樣式

可以用大括號包裹多個樣式,逗號分隔樣式,然後樣式值用冒號,這樣才可以有效哦。

jq如何改變css樣式

最後樣式互動就大功告成了,多個樣式就會被修改了

jq如何改變css樣式

##【推薦學習:

javascript高階教學

以上是jq如何改變css樣式的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn