Wildcard * in CSS per la classe

Wildcard * in CSS per la classe
In CSS, ci sono numerosi selettori utilizzati per scopi diversi, tra cui selettori di jolly, selettori ID, selettori di classe e molti altri. Più specificamente, il selettore jolly sceglie più elementi contemporaneamente. Seleziona nomi o caratteristiche di classe di un tipo simile e assegna le proprietà CSS. Ogni volta che gli utenti impiegano questo selettore jolly in CSS, tutti gli articoli con lo stesso nome di classe verranno selezionati.

Questo post dimostrerà l'uso di jolly * in CSS per la classe.

Come utilizzare il jolly * in CSS per la classe?

Per utilizzare il jolly * in CSS per la classe, prova la procedura menzionata.

Passaggio 1: inserire un'intestazione
Prima di tutto, aggiungi un'intestazione utilizzando il tag di intestazione. Per farlo, aggiungeremo il "

"Tag.

Passaggio 2: creare contenitori di div
Crea tre contenitori di div separati con l'aiuto di ""Elemento e inserire un"classe"Attributo in ciascun contenitore con un nome specifico in base alle tue preferenze.

Passaggio 3: Aggiungi testo
Successivamente, utilizza il “

"Tag per inserire il testo sotto forma di un paragrafo. Inoltre, aggiungi un "classe"Attributo con un nome univoco. Quindi, incorporare un testo tra il tag paragrafo:

Linuxhint Ltd UK



Primo contenitore
Secondo contenitore
Terzo contenitore

LinuxHint fornisce il contenuto per varie categorie, tra cui Docker, HTML/CSS, Discord, PowerShell, Windows, Git Hub e molti altri.


Produzione

Passaggio 4: accedi alla classe "STR" utilizzando il * jolly
Quindi, specificando "[class*= "str"]"Selezionerà tutti gli elementi Div il cui nome di classe inizia con"str":

[class*= "str"]
Background: RGB (80, 119, 250);
colore bianco;

Quindi, applica le seguenti proprietà CSS su tutti gli elementi selezionati:

  • "sfondo"La proprietà imposta il colore per lo sfondo dell'elemento.
  • "colore"Assegna il colore specifico per l'elemento.

Passaggio 5: intestazione di stile
Accedi all'intestazione con l'aiuto di "

"Tag:

H1
Colore: RGB (44, 3, 230);
Testo-align: centro;

Dopodiché, il "colore"La proprietà viene applicata per rendere colorata l'intestazione e impostare il “Allinee"Valore della proprietà come"centro"Per centrali allineare il testo.

Passaggio 6: contenitore "Main-Div"
Accedi al contenitore di div principale utilizzando il selettore DOT con il nome della classe ".Main-Div":

.main-div
ALIGE-ITMS: CENTRO;
Testo-align: centro;
larghezza: 60%;
Margin-Left: 80px;
Bordo: 2 px blu solido;

Nel frammento di codice sopra:

  • "allineare"La proprietà imposta l'allineamento dell'elemento come"centro".
  • "allineamento"È utilizzato per allocare l'allineamento del testo nell'elemento.
  • "allineare"La proprietà imposta l'allineamento dell'elemento come" Centro ".
  • "margine-sinistra"Imposta il margine dal lato sinistro dell'elemento.
  • "confine"Definisce un limite all'esterno dell'elemento con una larghezza, stile e colore adeguati.

Produzione

Questo è tutto! Hai imparato a conoscere il jolly * in CSS per la classe.

Conclusione

Il jolly “*” in CSS è un selettore che viene utilizzato per la selezione di tutti gli elementi in base al valore definito. Dopo averli selezionati, è possibile applicare un singolo layout di stile a tutti gli elementi. Questo approccio è utile quando è necessario modellare più elementi con lo stesso valore di classe. Questo articolo ha spiegato il jolly * in CSS per la classe.