如何修改css样式

Apr 26, 2021 am 09:32 AM
css

修改css样式的方法:首先引入jQuery;然后定义元素的style样式;接着指定好触发变化颜色的事件;最后用css()覆盖原来元素的样式即可。

如何修改css样式

本文操作环境:windows7系统、css3&&jquery3.2.1版、Dell G3电脑。

如图,引jQuery,然后定义元素的style样式,根据自己的元素来定义,这里小编我随性定义div的style样式。

ae8e8044382713f2a66101852873397.png

接着我们看样式所带来的效果,接着开始设置点击按钮会产生变化颜色等交互效果。

8a4fcdc334363850930c5e044f23ffc.png

首先,自然是指定好触发变化颜色的事件,可以是经过触发等,这里我就点击即可触发颜色变化。

7d052b44da8cdae9fb1c1bb45b4ed08.png

如图,用css()便可以覆盖原来元素的样式了哦。

1823b1366922272c79ba9ad248f31e2.png

如果是修改元素单个样式,要用逗号隔开,不可以使用冒号哦。

419687cc4bd86693e91f916b55ea3be.png

这样就可以得到交互效果了,但是这只是一个样式的效果发生了变化,多个效果怎么做呢?

fd26b228db07c710d94fc85bee2cfe0.png

可以用大括号裹住多个样式,逗号分隔样式,然后样式值用冒号,这样才可以有效哦。

8b26d0fb790ca6dfd916b5bd9b11156.png

最后样式交互就大功告成了,多个样式就会被修改了,可以自己多研究哟。

aca553ce14549cf645f69de8d7ce6ef.png

【推荐学习:css视频教程

Atas ialah kandungan terperinci 如何修改css样式. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Tag artikel panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Apakah maksud pemegang tempat dalam vue Apakah maksud pemegang tempat dalam vue May 07, 2024 am 09:57 AM

Apakah maksud pemegang tempat dalam vue

Bagaimana untuk menulis ruang dalam vue Bagaimana untuk menulis ruang dalam vue Apr 30, 2024 am 05:42 AM

Bagaimana untuk menulis ruang dalam vue

Bagaimana untuk mendapatkan dom dalam vue Bagaimana untuk mendapatkan dom dalam vue Apr 30, 2024 am 05:36 AM

Bagaimana untuk mendapatkan dom dalam vue

Apakah maksud span dalam js Apakah maksud span dalam js May 06, 2024 am 11:42 AM

Apakah maksud span dalam js

Apakah maksud rem dalam js Apakah maksud rem dalam js May 06, 2024 am 11:30 AM

Apakah maksud rem dalam js

Bagaimana untuk memperkenalkan imej ke dalam vue Bagaimana untuk memperkenalkan imej ke dalam vue May 02, 2024 pm 10:48 PM

Bagaimana untuk memperkenalkan imej ke dalam vue

Apakah fungsi tag span Apakah fungsi tag span Apr 30, 2024 pm 01:54 PM

Apakah fungsi tag span

Dalam bahasa apakah pemalam penyemak imbas ditulis? Dalam bahasa apakah pemalam penyemak imbas ditulis? May 08, 2024 pm 09:36 PM

Dalam bahasa apakah pemalam penyemak imbas ditulis?

See all articles