Cascading Style Sheets (CSS) è un linguaggio di alto livello basato su computer, che viene utilizzato per progettare pagine Web basate su HTML. La progettazione di una pagina include layout, colori, dimensioni del carattere, stili di scrittura e mantengono il design della pagina. In questo articolo, imparerai sulla lingua di stile più potente e imparerai anche come il CSS governa a HTML. Le proprietà di stile CSS sono incorporate con i tag HTML. CSS non è markup o linguaggio procedurale; È un linguaggio dichiarativo che definisce le proprie regole in base allo stile degli attributi.

Sintassi CSS

La sintassi di CSS comprende un selettore e un blocco di dichiarazione e il blocco di dichiarazione contiene le proprietà e i loro valori. Come mostrato nell'esempio dato

H1
Testo-align: giusto;

In questo esempio "H1" è un selettore, "Allineati al testo" è una proprietà e "Giusto" è il valore della proprietà menzionata.

Selettore CSS

Proprio come HTML ha tag come CSS ha selettori, che vengono utilizzati per accedere agli elementi HTML e modellarli internamente o usando un file CSS esterno. Questi selettori vengono utilizzati per applicare le proprietà CSS specifiche su elementi HTML selezionati.

Un elemento può essere selezionato utilizzando il nome di elementi, l'ID e il nome della classe. Ad esempio, per accedere a un elemento con il nome della classe, inserisci un punto (.) prima del nome della classe come mostrato nell'esempio dato.

.Centro
Testo-align: giusto;
Colore: verde;

Secondo l'esempio sopra, gli elementi HTML con classe "centrale" saranno allineati a destra e ha un colore verde.

La classe CSS è implementata.

Come implementare CSS su HTML?

Esistono tre modi per l'implementazione di CSS su un file HTML:

• In linea
• interno e
• esterno.

Styling CSS in linea

Nello stile in linea, le proprietà CSS sono fissate all'interno dei tag HTML utilizzando l'attributo di stile come mostrato nell'esempio dato.

Questo tag viene utilizzato per i paragrafi.

La proprietà in stile dato rende il paragrafo specifico verde. Usando lo stile CSS in linea è possibile applicare questo stile solo su elementi specifici.

Tuttavia, questo stile CSS in linea non è raccomandato perché aumenta la complessità del codice.

Styling CSS interno

Lo stile CSS interno deve essere applicato su tutta la pagina Web perché è incorporato nella sezione della testa su una pagina HTML con a Elemento e possiamo semplicemente accedere a qualsiasi ELELMTN utilizzando i selettori CSS. Come mostrato nell'esempio dato.

Esempio

<

Intestazione

Paragrafo

Styling CSS esterno

Nello styling CSS esterno, viene creato un file CSS di basi con l'estensione di .CSS che si collegava al file HTML aggiungendo il suo collegamento nella sezione testa. Più pagine HTML possono essere utilizzate contemporaneamente questo file esterno. Di seguito è riportato un esempio di file di stile CSS esterno.

Esempio

stile.CSS

corpo
Background-color: verde;

H1
colore rosso;

P
colore nero;

indice.html

Intestazione

Paragrafo

Commenti in CSS

In ogni linguaggio di programmazione i commenti non vengono visualizzati sul browser, tuttavia, possono aiutare a elaborare e comprendere il codice al momento della modifica.

In CSS è un commento tra questi segni ( /* E */). Il modello di un commento è anche mostrato nell'esempio dato:

/ * Questo è un commento */
H1
colore rosso;

Conclusione

CSS sta per fogli di stile a cascata ed è utilizzato per progettare pagine Web basate su HTML. Usando lo stile CSS, la progettazione di una pagina che include layout, colori, dimensioni del carattere e molte più cose possono essere fatte. In questo post l'introduzione di CSS, la sintassi di CSS, il funzionamento di CSS con i file HTML e come scrivere commenti in CSS è spiegata con l'aiuto degli esempi.