Impara le basi stesse del CSS in un minuto

CSS sta per foglio di stile a cascata. CSS specifica come gli elementi HTML dovrebbero essere visualizzati sullo schermo. In altre parole, CSS descrive la presentazione delle pagine Web. Fornisce diverse proprietà di stile agli elementi HTML, come colore di sfondo, in stile font, colore e molti altri. Permette inoltre di specificare come la pagina Web appare su diverse dimensioni dello schermo.

Questo blog parla:

• Come definire le proprietà CSS?
• Quali sono i tipi di selettori CSS?
• Diversi modi per definire le proprietà CSS
• Come usare CSS in linea?
• Come usare un foglio di stile incorporato?
• Come utilizzare un foglio di stile esterno?

Come definire le proprietà CSS?

Per definire le proprietà CSS per gli elementi HTML, è possibile utilizzare la seguente sintassi:

selettore
costo dell'immobile;
costo dell'immobile;

Qui:

• Il primo componente di una regola CSS è un CSS "selettore". Il selettore specifica quali elementi HTML devono essere selezionati per applicare le proprietà CSS.
• All'interno del suo corpo, le proprietà sono definite con i rispettivi valori.

Quali sono i tipi di selettori CSS?

I selettori sono di tre tipi che sono definiti di seguito:

Selettore degli elementi
Elemento il selettore CSS viene utilizzato per applicare le proprietà CSS agli elementi con nomi di tag specifici:

H1
colore blu;

Nell'esempio sopra, il "H1"È l'elemento intestazione.

Selettore di classe
Il selettore di classe seleziona tutti gli elementi che appartengono alla classe menzionata e quindi applica le proprietà CSS aggiunte:

.contenuto principale
Larghezza: 300px

Secondo il codice indicato, la proprietà di larghezza verrà applicata all'elemento con il nome della classe ".contenuto principale".

Selettore ID
Selezionisti ID Selezionare un elemento particolare in base al suo ID:

#parà
Testo-align: centro;

Nota: Negli esempi sopra, il "colore","larghezza", E "allineamento"Sono le proprietà.

Come usare CSS in linea?

CSS in linea si riferisce al CSS quando applicato direttamente ai nostri elementi HTML. Per fare questo, usa il “stile"Attributo all'interno del tag di apertura dell'elemento e quindi includere le proprietà.

Guarda l'esempio dato:

CIAO MONDO!

Produzione

Come usare il foglio di stile incorporato?

Per incorporare un foglio di stile CSS nel file HTML, utilizzare il “"Elemento all'interno della sezione testa per specificare le proprietà come segue:

Produzione

Come utilizzare un foglio di stile esterno?

Se il progetto contiene più file, è meglio creare un foglio CSS esterno con l'estensione ".CSS". Quindi, utilizzalo nel progetto aggiungendo un collegamento al foglio CSS esterno nei file HTML.

Ad esempio, l'elemento è fornito nella sezione principale del file HTML come questo:

All'interno del foglio di stile esterno, aggiungi il codice:

P
Font-size: 30px;
colore viola;
Font-weight: audace;
Testo-align: centro;

Il codice sopra verrà visualizzato come indicato di seguito:

Questo riguardava le basi del CSS.

Conclusione

Tre modi per definire le proprietà di styling agli elementi HTML sono CSS in linea, CSS interni e CS esterni. Per applicare le proprietà di stile agli elementi, è possibile utilizzare selettori, come selettori di elementi, selettori di classe e selettori ID. Quindi, specifica le proprietà con i loro valori all'interno delle staffe ricci dei selettori. Questo blog ha discusso delle basi del CSS con esempi.