เพื่อให้ได้เอฟเฟกต์พิเศษ เราจำเป็นต้องใช้ Javascript เพื่อเปลี่ยนแอตทริบิวต์ CSS ของแท็กบางแท็กแบบไดนามิก ตัวอย่างเช่น: เมื่อเมาส์เลื่อนผ่านรูปภาพ เราจะเพิ่มเส้นขอบให้กับรูปภาพ โค้ดอาจเป็นดังนี้:
เบื้องหลังสไตล์ใน JavaScript ควรมีคุณสมบัติอย่างไร ?
| ป้ายกำกับกล่องและการเปรียบเทียบ | |
|---|---|
| แอตทริบิวต์ ไวยากรณ์ CSS (ไม่คำนึงถึงขนาด | ตัวพิมพ์)ไวยากรณ์ JavaScript (คำนึงถึงตัวพิมพ์เล็กและใหญ่) |
| เส้นขอบ | เส้นขอบ |
| ด้านล่าง | เส้น |
| ขอบด้านล่าง เส้นขอบสีด้าน | ล่าง |
| เส้น | |
| ด้าน | ล่าง |
| เส้นขอบ | สไตล์ด้านล่าง |
| เส้นขอบ | สี |
| เส้นขอบ | สี- |
| เส้น | ขอบ |
| ขอบ | ซ้าย |
| เส้นขอบสี | ซ้าย เส้นขอบ |
| สีซ้าย | -เส้นขอบ |
| สไตล์ | |
| ซ้าย-เส้น | ขอบ |
| กว้าง | ซ้าย |
| เส้น | ขอบความกว้างซ้าย-เส้นขอบขวา |
| เส้นขอบสไตล์ | |
| ด้านบน | เส้นขอบด้านบน เส้น |
| ขอบด้านบนสี | เส้นขอบด้านบนสี เส้นขอบ |
| สไตล์ | ด้านบน |
| กว้าง | เส้น |
| ขอบความกว้าง | เส้นขอบ | กว้าง
| ชัดเจน | ชัดเจน ลอย |
| ลอย | สไตล์ |
| ระยะขอบ | ระยะ |
| ขอบ-ขอบล่าง | ขอบล่าง |
| -ขอบซ้าย | ขอบ | ซ้าย
| ขอบ | ขวา |
| ขอบ | |
| ด้านบน | ด้านบน |
| เบาะรอง | |
| - เบาะล่าง | เบาะล่าง |
| - เบาะซ้าย | เบาะ | ซ้าย
| - เบาะ | ขวา |
| เบาะขวา - | เบาะ | บน ด้านบน
| สี | และ |
| พื้นหลัง ป้ายกำกับและการเปรียบเทียบ | |
| แอตทริบิวต์ ไวยากรณ์ CSS (ไม่คำนึงถึงขนาดตัวพิมพ์) | ไวยากรณ์ JavaScript (คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ |
| ) | พื้น |
| หลัง | พื้น |
| หลัง | พื้น |
| หลัง | - |
| สิ่ง | ที่ |
| แนบ | มา |
| แท็กสไตล์และคุณลักษณะเปรียบเทียบกับ | |
| ไวยากรณ์ CSS (ไม่คำนึงถึงขนาดตัวพิมพ์) | ไวยากรณ์ JavaScript (คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่) |
| การแสดง | ผล แสดง |
| รายการสไตล์ประเภท | listStyleType |
| รายการสไตล์รูปภาพ | listStyleImage |
| รายการสไตล์ตำแหน่ง | listStylePosition |
| รายการสไตล์ | listStyle |
| พื้นที่สีขาว | whiteSpace |
| แท็กรูปแบบข้อความและคุณลักษณะเปรียบเทียบกับ | |
| ไวยากรณ์ CSS (ไม่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่) | ไวยากรณ์ JavaScript (คำนึงถึงตัวพิมพ์เล็กและ |
| ตัว | พิมพ์ |
| ใหญ่ | ) |
| ฟอนต์ | ฟอนต์ ฟอนต์ |
| ตระกูล | ฟอนต์ |
| ฟอนต์ | ขนาดฟอนต์ |
| สำหรับ | ครอบครัว |
| การเปรียบเทียบป้ายกำกับข้อความและแอตทริบิวต์ ไวยากรณ์ | |
| CSS (ไม่คำนึงถึงตัวพิมพ์เล็กและ | ตัวพิมพ์ใหญ่) ไวยากรณ์ JavaScript (คำนึงถึงตัวพิมพ์เล็ก | และ
| ตัว | พิมพ์ |
| ใหญ่ | ) |
| ระยะ | ห่าง |
| ระหว่าง | ตัว |
| อักษร | ระยะ |
| ห่าง | ระหว่าง |
| ตัว | |
| แบ่ง | บรรทัด |
| ข้อความแปลง | |
| แนวตั้ง จัด | แนวตั้ง |