Predefinito W3.CSS


W3.CSS è facile da leggere

Le pagine W3.CSS sono facili da leggere, anche per persone con lievi difficoltà di lettura.

  • La dimensione del carattere predefinita è 15px
  • Il carattere predefinito è Verdana, che ha una buona spaziatura tra le lettere
  • Anche l'interlinea predefinita (1.5) è molto buona

Intestazioni HTML <h1> - <h6>

Per impostazione predefinita, W3.CSS stilizza le intestazioni HTML in questo modo:

Esempio

<h1>Heading 1 (36px)</h1>

<h2>Heading 2 (30px)</h2>

<h3>Heading 3 (24px)</h3>

<h4>Heading 4 (20px)</h4>

<h5>Heading 5 (18px)</h5>
<h6>Heading 6 (16px)</h6>

Classi di dimensioni dei caratteri

Le intestazioni dovrebbero essere usate per quello che sono: Intestazioni.

Con W3.CSS, le dimensioni dei caratteri possono essere impostate dalle seguenti classi di dimensioni w3 :

Esempio

w3-tiny
w3-small
w3-medium (Default)
w3-large
w3-xlarge
w3-xxlarge
w3-xxxlarge
w3-jumbo


Sovrascrivere le impostazioni predefinite di W3.CSS

L'override delle impostazioni predefinite di W3.CSS è molto semplice.

Hai almeno tre opzioni:

  1. Sostituisci le impostazioni predefinite nella sezione <head> della tua pagina
  2. Aggiungi il tuo file CSS dopo W3.CSS
  3. Scarica e modifica il contenuto del file W3.CSS

Sostituisci in<head>

h1{font-size:64px;}
h2{font-size:48px;}
h3{font-size:36px;}
h4{font-size:24px;}
h5{font-size:20px;}
h6{font-size:18px;}

Aggiungi il tuo CSS

<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="myStyle.css">

Cambia W3.CSS

h1{font-size:36px} h2{font-size:30px} h3{font-size:24px} h4{font-size:20px} h5{font-size:18px} h6{font-size:16px}

Modifica del carattere predefinito

Nell'intestazione della tua pagina web (o nel tuo foglio di stile), dopo aver caricato W3.CSS, cambia lo stile di html e corpo:

Esempio

<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
html, body, h1, h2, h3, h4, h5, h6 {
  font-family: cursive, sans-serif;
}
</style>