CSS dan JS bekerja sama secara erat untuk menambahkan banyak efek unik ke halaman kita. Ada juga kasus terkait di 52CSS.com. Untuk mencapai beberapa efek khusus, kita perlu menggunakan Javascript untuk secara dinamis mengubah properti CSS dari tag tertentu. Misalnya: ketika mouse melewati suatu gambar, kita menambahkan batas pada gambar. Kodenya mungkin sebagai berikut: Apa yang harus menjadi atribut setelah gaya dalam JavaScript?
<skrip tipe="teks/javascript">
fungsi gambarOver(e) {
e.style.border="1 piksel merah pekat";
}
fungsi gambarOut(e) {
e.style.borderWidth=0;
}
</script>
<img src="01.png" onmouseover="imageOver(this)" onmouseout="imageOut(this)" />
JavaScript CSS Style atribut tabel perbandingan
label kotak dan perbandingan atribut
Sintaks CSS (tidak peka huruf besar/kecil) JavaScript sintaksis (peka huruf besar-kecil)
perbatasan perbatasan
perbatasan-batas bawahbatasBawah
batas warna bawah batasBottomColor
border-bottom-gaya borderBottomStyle
perbatasan-lebar bawah perbatasanBottomWidth
border-warna borderColor
perbatasan-kiri perbatasanKiri
perbatasan-warna kiri borderLeftColor
border-left-style borderLeftStyle
perbatasan-lebar kiri borderLeftWidth
perbatasan-kanan perbatasankanan
perbatasan-warna kanan borderRightColor
borderRightStyle gaya perbatasan kanan
border-right-width borderRightWidth
borderStyle bergaya perbatasan
perbatasan-atas perbatasanTop
perbatasan-warna atas borderTopColor
borderTopStyle bergaya perbatasan atas
border-top-width borderTopWidth
lebar batas borderWidth
jelas jelas
mengapung floatStyle
margin margin
margin-margin bawahBawah
margin-kiri marginkiri
margin-kanan marginkanan
margin-top marginTop
bantalan bantalan
bantalan-bawah bantalanBawah
padding-padding kiriKiri
padding-kanan paddingkanan
padding-top
paddingTag dan atribut warna dan latar belakang teratas dibandingkan dengan
sintaksis CSS (tidak peka huruf besar-kecil) Sintaks JavaScript (peka huruf besar-kecil)
latar belakang latar belakang
latar belakang-lampiran backgroundLampiran
warna latar belakang warna latar belakang
gambar latar belakang gambar latar belakang
posisi latar belakang posisi latar belakang
latar belakang-ulangi latar belakangUlangi
warna warna
Tag gaya dan atribut dibandingkan dengan
sintaksis CSS (tidak peka huruf besar-kecil) Sintaks JavaScript (peka huruf besar-kecil)
tampilan tampilan
tipe gaya daftar listStyleType
daftar-gaya-gambar listStyleImage
daftar-gaya-posisi listStylePosition
gaya daftar listStyle
tag dan atribut gaya teks
spasi putih
dibandingkan dengansintaksis CSS (tidak peka huruf besar-kecil) Sintaks JavaScript (peka huruf besar-kecil)
huruf huruf
font-keluarga fontFamily
ukuran font fontSize
gaya font fontStyle
varian font fontVariant
font-weight fontWeight
tag teks dan atribut dibandingkan dengan
sintaksis CSS (tidak peka huruf besar-kecil) Sintaks JavaScript (peka huruf besar-kecil)
spasi huruf spasi huruf
jeda baris lineBreak
garis-tinggi garisTinggi
perataan teks perataan teks
dekorasi teks textDecoration
indentasi teks textIndent
pembenaran teks pembenaran teks
transformasi teks textTransform
perataan vertikal perataan vertikal