Cascading Style Sheets нь Cascade гэж юу болохыг мэдэж аваарай

CSS богино курс

Уг координаци нь CSS загварын хуудсыг ашигтай болгодог. Товчоор хэлбэл, зөрчилдөөний хэв маягийг хэрхэн хэрэглэхийг харуулсан дарааллын дарааллыг тодорхойлдог. Өөрөөр хэлбэл, хэрэв та хоёр загвартай бол:

p {color: red; }
p {color: blue; }

Загвар хуудас нь улаан, цэнхэр хоёулаа байх ёстой гэсэн тэмдэглэгээ нь ямар өнгөтэй байх ёстойг тодорхойлдог. Эцэст нь зөвхөн нэг өнгө нь догол мөрөнд хэрэглэж болно, тиймээс захиалга байх ёстой.

Дээрх дараалал нь сонгон шалгаруулагчид (дээрх жишээнд p) хамгийн өндөр давуу талтай ба баримт бичигт ямар дарааллаар орсоныг хэрэглэдэг.

Дараах жагсаалт нь таны браузер загварыг урьдчилан тодорхойлсоныг хялбаршуулах явдал юм:

  1. Элементийг тохируулах сонгогчийг сонгох загварын хуудсыг харна уу. Хэрвээ тодорхойлогдсон загвар байхгүй бол browser-ийн анхдагч дүрмийг ашиглана уу
  2. Загварыг сонгож тэмдэглэсэн сонгон шалгаруулагчдад чухал ач холбогдолтой элементүүдийг сонгох хэрэгтэй.
  3. Style хуудас доторх бүх хэв маяг нь анхдагч вэб хөтчийн загваруудыг (хэрэглэгчийн загварын хуудаснаас бусад тохиолдолд) дарж өөрчлөх болно.
  4. Загварын сонгон шалгаруулагч илүү тодорхой байх тусам илүү нарийн байх болно. Жишээ нь, div> p.class нь p -ээс илүү тодорхойлогдсон p.class-с илүү тодорхойлогдсон байдаг.
  5. Эцэст нь, хэрэв хоёр дүрмүүд ижил элементэд үйлчилдэг бөгөөд ижил сонгогчтой ижил байх тохиолдолд хамгийн сүүлд ачаалагдсан байна. Өөрөөр хэлбэл стилийн хуудсыг дээд талаас уншиж, стиль нь нэг нэгнийхээ дээр байрладаг.

Эдгээр дүрмүүд дээр үндэслэн дээрх жишээн дээр догол мөрүүд цэнхэрээр бичигдэх болно, учир нь p {color: blue; } хэв маягийн хуудасны сүүлд ирдэг.

Энэ нь каскадын хялбаршуулсан тайлбар юм. Хэрэв та cascade хэрхэн ажилладаг талаар илүү ихийг мэдэхийг хүсвэл "Cascade" гэж юу вэ? Cascading Style Sheets-д ямар утгатай вэ? .