CSS può essere aggiunto come file separato o incorporato direttamente nel documento HTML. Se si desidera includere CSS in HTML, allora "Stili in linea", "Stili incorporati", e il "Fogli di stile esterno" sono i tre metodi per ottenere questa funzionalità. Tuttavia, il modo ideale è quello di creare e applicare gli stili a HTML è utilizzare i fogli di stile esterno, poiché sarà necessaria una modifica del markup minima per influire su più pagine contemporaneamente.

Questo articolo discuterà della procedura per Aggiunta UN File CSS esterno In Html. Spiegheremo anche collegamento E importazione Un file CSS esterno in HTML. Inoltre, verranno forniti esempi relativi ai metodi menzionati. Quindi iniziamo!

Come aggiungere un file CSS esterno in HTML

Se si desidera applicare uno stile a più pagine Web contemporaneamente, l'aggiunta di un file CSS esterno è perfetto. Un CSS esterno è considerato un file separato che comprende tutte le regole di stile e può essere collegato a qualsiasi pagina HTML del tuo sito Web. L'aggiunta di un file CSS esterno consente di modificare l'aspetto del tuo sito Web apportando solo modifiche in un singolo file. Inoltre, mantenere i file CSS, JavaScript e HTML separati consentono di mantenere il codice e migliorare la leggibilità.

Esistono due metodi per l'aggiunta di un file CSS esterno HTML: collegamento e importazione.

Collegamento di un file CSS esterno in HTML

Prima di tutto, creeremo un file CSS in HTML. A tale scopo, puoi aprire il tuo editor di codice preferito; Tuttavia, useremo il codice Visual Studio.

Dopo l'apertura del codice VS, creeremo un "stile.CSS " File CSS per l'aggiunta di stili:

Successivamente, specificheremo lo stile che vogliamo applicare alla pagina Web nel file CSS aperto. Qui, abbiamo assegnato i valori al "sfondo" E "font" Proprietà per HTML "corpo" e aggiunto anche il "colore" Per l'intestazione:

corpo
Sfondo: rosa;
FONT: 18px Arial, sans-serif;

H1
colore blu;

Premere "Ctrl+S" Per salvare il codice aggiunto in "stile.CSS " file:

IL "" Il tag viene utilizzato per collegare un CSS esterno a un file HTML. Questo tag viene aggiunto "" sezione di un documento HTML. Abbiamo collegato il nostro file HTML con "stile.CSS " Nel programma di seguito donati, utilizzando il tag. Quindi, abbiamo aggiunto un'intestazione con il

tag e un paragrafo con il

etichetta. Lo stile specificato in "stile.CSS " Il file verrà applicato a questi elementi HTML:

Questo è Linuxhint.com

Stiamo imparando come aggiungere un file CSS in HTML

Salva questo programma JavaScript e apri il tuo file HTML nel browser:

Come puoi vedere, abbiamo applicato con successo lo stile specificato ai nostri elementi HTML collegandoli al file CSS esterno:

Importazione di un file CSS esterno in HTML

Un altro metodo per aggiungere un file CSS esterno è utilizzare il "@importare" Regola nel documento HTML. Il JavaScript "@importare" Le dichiarazioni forniscono istruzioni al browser per il caricamento e l'utilizzo degli stili dal file CSS esterno.

È possibile importare un file CSS esterno in HTML semplicemente aggiungendo la dichiarazione "@import" nel tag del documento HTML. In questo modo, ti sarà permesso di aggiungere altre regole CSS per gli elementi HTML, all'interno dello stesso tag:

Questo è Linuxhint.com

Stiamo imparando come aggiungere un file CSS in HTML

Nel programma JavaScript fornito, abbiamo importato il "stile.CSS " file e lo stile specificato con il file menzionato verrà applicato alle intestazioni. Abbiamo anche aggiunto stile per l'elemento HTML di paragrafo:

Nostro "il mio progetto.HTML " Il file ha i seguenti elementi HTML con gli stili applicati:

Conclusione

L'aggiunta di un file CSS in HTML è utile se si desidera applicare uno stile a più pagine Web contemporaneamente. Inoltre, quando si tiene separatamente i file HTML, JavaScript e CSS, il codice diventa facile da gestire. Questo articolo ha discusso della procedura per l'aggiunta di un file CSS in HTML. Abbiamo anche spiegato il collegamento e l'importazione di un file CSS esterno in HTML. Inoltre, vengono forniti anche esempi relativi ai metodi menzionati.