"Cascade" หมายถึงอะไรใน Cascading Style Sheets?

Cascading Style Sheets หรือ CSS ถูกตั้งค่าเพื่อให้คุณสามารถมีคุณสมบัติมากมายที่มีผลต่อองค์ประกอบเดียวกัน คุณสมบัติบางอย่างอาจขัดแย้งกับคนอื่น ตัวอย่างเช่นคุณอาจตั้งค่าสีตัวอักษรเป็นสีแดงในแท็กวรรคแล้วตั้งค่าสีตัวอักษรเป็นสีน้ำเงินในภายหลัง เบราเซอร์รู้ได้อย่างไรว่าสีใดที่จะทำให้ย่อหน้าได้? นี้จะตัดสินใจโดยน้ำตก

ประเภทของชีตสไตล์

มีสไตล์ชีตสามแบบ:

  1. ผู้แต่ง Style Sheets
    1. เหล่านี้เป็นสไตล์ชีตที่สร้างขึ้นโดยผู้เขียนของเว็บเพจ พวกเขาเป็นสิ่งที่คนส่วนใหญ่คิดถึงเมื่อคิด CSS สไตล์ชีต
  2. ชีตสไตล์ผู้ใช้
    1. แผ่นลักษณะผู้ใช้ถูกกำหนดโดยผู้ใช้เว็บเพจ สิ่งเหล่านี้ช่วยให้ผู้ใช้สามารถควบคุมวิธีแสดงหน้าเว็บได้มากขึ้น
  3. แผ่นสไตล์ของเอเจนต์ผู้ใช้
    1. รูปแบบเหล่านี้เป็นลักษณะที่เว็บเบราเซอร์ใช้กับเพจเพื่อช่วยแสดงหน้าเว็บนั้น ตัวอย่างเช่นใน XHTML ผู้ใช้ภาพส่วนใหญ่จะแสดงแท็ก เป็นตัวเอียง นี่กำหนดไว้ในสไตล์ชีตของเอเจนต์ผู้ใช้

คุณสมบัติที่กำหนดไว้ในแต่ละสไตล์ชีตข้างต้นจะได้รับน้ำหนัก สไตล์ชีตของผู้สร้างมีน้ำหนักมากที่สุดตามด้วยสไตล์ชีตของผู้ใช้และสุดท้ายโดยใช้สไตล์ชีตของเอเจนต์ผู้ใช้ ข้อยกเว้นนี้เป็นกฎที่ สำคัญ ในสไตล์ชีตของผู้ใช้ นี่มีน้ำหนักมากกว่าสไตล์ชีตของผู้เขียน

Cascading Order

เพื่อแก้ปัญหาความขัดแย้งเว็บเบราเซอร์จะใช้ลำดับการจัดเรียงต่อไปนี้เพื่อกำหนดลักษณะที่มีลำดับความสำคัญและจะใช้:

  1. ขั้นแรกให้มองหาคำประกาศทั้งหมดที่ใช้กับองค์ประกอบที่เป็นปัญหาและสำหรับประเภทสื่อที่กำหนด
  2. จากนั้นให้ดูที่สไตล์ชีตที่มาจาก ตามที่ผู้ใช้เป็นผู้ใช้แล้วตัวแทนผู้ใช้ รูปแบบที่สำคัญของผู้ใช้ที่มีความสำคัญสูงกว่าผู้แต่ง!
  3. ตัวเลือกที่เฉพาะเจาะจงมากขึ้นคือความสำคัญมากกว่าที่จะได้รับ ตัวอย่างเช่นสไตล์ "div.co p" จะมีลำดับความสำคัญสูงกว่าหนึ่งในแท็ก "p"
  4. สุดท้ายจัดเรียงกฎตามลำดับที่กำหนดไว้ กฎที่กำหนดไว้ในภายหลังในโครงสร้างเอกสารมีความสำคัญสูงกว่าที่กำหนดไว้ก่อนหน้านี้ กฎจากสไตล์ชีตที่นำเข้าจะได้รับการพิจารณาก่อนกฎในชีตสไตล์โดยตรง