CSS odpowiednik instrukcji „If”

CSS odpowiednik instrukcji „If”
Oświadczenie „IF” lub „IF-Else” jest instrukcją warunkową, która działa w taki sposób, że jeśli „if-hodement” jest prawdziwe. Problem polega jednak na tym, że stwierdzenia „jeśli” są ograniczone tylko do języków programowania, takich jak Java, JavaScript, Python, C ++ itp., i nie mogą być używane przez języki rozwoju front-end, takie jak HTML i CSS.

Ponieważ CSS jest językiem arkusza stylów i nie może wykonywać logiki, w przeciwieństwie do języków programowania, nie możemy napisać instrukcji „If” w CSS, ale istnieją alternatywy dla użycia warunku „IF” w CSS.

W tym artykule omówimy alternatywną metodę wykonywania operacji warunkowej w HTML bez użycia faktycznego instrukcji „If”. Oznacza to stosowanie warunków w CSS bez faktycznego stwierdzenia „jeśli” jest możliwe.

Korzystanie z selektorów CSS | Alternatywna metoda

W elemencie stylu CSS utwórz selektory klas, które odnoszą się do klas utworzonych w dokumencie HTML, dla którego wymagane jest alternatywne rozwiązanie CSS „If”. A następnie, wewnątrz selektora klas, napisz właściwość, aby wykonać dowolne zadanie, takie jak „Color: Purple”, co oznacza, że ​​kolor elementów w wybranej klasie powinien zostać zmieniony na fioletowy.

Aby utworzyć warunki do wykonania właściwości CSS, utwórzmy wiele klas, z których każda zawiera informacje tekstowe:


To jest pierwsza linia!



To jest druga linia!



To jest trzecia linia!

Aby poinstruować kompilator, aby wykonał zadania „If” (takie jak „jeśli” ta konkretna klasa jest wybrana, „wtedy” ta konkretna rzecz), możemy utworzyć wiele selektorów klas w elemencie stylu CSS:

.linia 1
kolor fioletowy;

.linia 2
Zielony kolor;

.linia3
kolor niebieski;

Powyższy kod wytworzy następujące dane wyjściowe:

Powyższy rysunek wyraźnie pokazuje, że program został wykonany zgodnie z warunkami, które zastosowaliśmy w elemencie stylu CSS.

To podsumowuje metodę CSS równoważną instrukcji programowania „If”.

Wniosek

W języku CSS Stylesheet nie ma instrukcji „If”, ale istnieje alternatywna metoda wykonywania tego samego zadania w CSS. Możliwe jest utworzenie warunków do wykonywania określonych właściwości CSS poprzez dodanie selektorów klas w elementach stylu CSS, które będą działać w taki sposób, że definiują one operacje w celu przeprowadzenia odniesienia do określonych klas.