La dimensione predefinita del font di ogni browser è 16px? Perché?

Il CSS3 definisce una nuova unità di lunghezza per font-size denominata rem. Questo ci consente di calcolare l'elemento font-size relativo all'elemento root (elemento html).La dimensione predefinita del font di ogni browser è 16px? Perché?

per calcolare il più font-size facilmente, di solito assumiamo del font-size elemento radice è 16px, quindi il CSS di solito finisce in questo modo:

html { font-size:62.5%; } // 10px = 16px * 0.625

Così, ogni altezza elemento con rem è relativo al 10px, per esempio

p{ font-size : 1.4rem ;} // 14px = 10px * 1.4

non posso trovare il motivo per cui si suppone che possiamo moltiplicare per 16px? Come possiamo credere che ogni browser abbia lo stesso valore di base di 16px? Esiste una descrizione standard sul predefinito 16px?

Ref

fonte

2015-04-08 monjer

Probabilmente tradizione. Il valore iniziale di 'font-size', che viene usato quando si calcola la dimensione del carattere predefinito di' html', come pure il calcolo di 'rem' e' em' nelle media query, è 'medio'. Il 16px viene dalle preferenze dell'utente all'interno del browser. Vedi http://stackoverflow.com/questions/10470727/what-is-an-em-if-the-font-size-of-the-document-is-specified-in-ems/10470734#10470734 – BoltClock

La base font-size è determinato dagli utenti predefiniti preferenze con nel browser.

In quasi tutti i browser, 16px è lo standard per i font proporzionali. Questo può anche cambiare a seconda che il carattere usi i caratteri serif o sia un font a larghezza fissa.

Nella maggior parte dei progetti, di solito preimpostata dell'elemento html per utilizzare un valore px invece di un valore % o em/rem solo per garantire che tutti i browser, schermi e dispositivi hanno la stessa dimensione del font e che elementi di una pagina continuano a le stesse dimensioni e proporzioni.

Basta ricordare, utilizzando em prende i genitori font-size ed è proporzionale che, mentre rem utilizza gli elementi radice html

Per esempio:

html { 
 
    font-size: 16px; 
 
} 
 
h1 { 
 
    font-size: 2em; // 32px 
 
} 
 
p { 
 
    font-size: 1em; // 16px 
 
} 
 
.someClass { 
 
    font-size: .75em; // 12px 
 
} 
 
.someClass p { 
 
    font-size: 2em; // 24px 
 
} 
 
.someClass p .test { 
 
    font-size: 1.25rem; // 20px 
 
}

<html> 
 
<h1>2em Title Text</h1> 
 
<p>Normal Element Text</p> 
 
<div class="someClass"> 
 
    someClass font size 
 
    <p>SomeClass with em</p> 
 
    <p><span class="test">someClass p element with class test</span> 
 
    </p> 
 
</div> 
 

 
</html>

fonte

2015-04-08 10:48:24 Stewartside

Per curiosità ... sta mantenendo il design di tutto il browser/dispositivi se non si lasciano agli utenti grandi preferenze per le dimensioni dei caratteri? Ad esempio, le persone anziane tendono a "aumentare" la dimensione del carattere perché le aiuta a leggere meglio. Se imposti il valore assoluto in body o html, le preferenze dell'utente vengono ignorate. Vale la pena di mantenere il design? – Chayemor

@Chayemor ora dipende interamente dalle tue preferenze su come vuoi che il tuo sito web guardi.Se lo desideri pixel perfetto in base a un design su ogni sistema operativo e browser, è necessario impostarlo. Se sei aperto a questo, ecc., Allora sicuramente non impostarlo nel tuo CSS. Nella mia esperienza, solo il più piccolo degli utenti modifica effettivamente la dimensione del carattere e di solito ha una buona conoscenza tecnica perché è nascosto nelle impostazioni del browser e saprebbe come aggirarlo. – Stewartside

Ho pensato la stessa cosa ma volevo avere un'altra opinione in merito. Alla fine giudico in base al sito. Se il design consente un po 'di movimento, allora il 100% lo è. Se è pixel-perfect, allora ciao valore assoluto di PX. Grazie. – Chayemor

La dimensione predefinita del font di ogni browser è 16px? Perché?

risposta

Problemi correlati