Impostazioni nel CSS: interlinea
Nei CSS, la distanza tra le linee è molto facile da impostare. A questo scopo v'è una proprietà speciale. Ma, naturalmente, ci sono molti altri parametri, che sono universali e possono essere applicati al testo.
Se nessun aggiustamento è fatto, si sono impostati ai valori di default. è possibile modificare la distanza se lo si desidera. Il valore può essere una percentuale o pixel.
Altezza fila
La distanza tra le linee CSS può essere dimostrato dalla seguente figura.
Nell'immagine sopra mostra i parametri con distanze corrispondenti. Il testo è in spazio font-size. Si noti che la riga di testo non inizia alla base e leggermente più alto. Spazio sottostante a lettere che presentano elementi inferiori (g, y, e così via).
Si noti che lo spazio tra i blocchi font-size è definita interlinea. Con HTML e CSS questa proprietà non appare, ma è negli altri editor di grafica e testo. Ad esempio, in Adobe Photoshop.
La figura qui sopra mostra in quale parte del "Photoshop", è possibile specificare che porta. E la prossima specificato impostazione font-size.
Esempi di utilizzo line-height
In CSS, la distanza tra le linee può essere impostato per cento. Un esempio illustrativo è data sotto.
Nel caso di piccoli valori degli utenti del vostro sito sarà scomodo da leggere.
La distanza può essere variato e la dimensione del carattere. Se la differenza tra i parametri di base sarà molto diverso nei numeri, la differenza viene compensata dalla crescita principale.
sottigliezze del design
La distanza tra le linee di CSS può ulteriormente personalizzare le varie trattini. Si consideri l'esempio in figura.
Nella "elemento" in questo caso sarà il testo. Imbottitura – imbottitura è all'interno dell'oggetto, e il margine – il rientro dell'oggetto. Border – questo frame. Può essere 0 pixel, e può essere 100.
L'immagine seguente mostra immediatamente tutti i margini, il telaio e l'altezza di una riga di testo.
Se hai un piccolo testo, il tutto in una sola riga, o ogni riga in un paragrafo a parte, la distanza può essere regolata tra i paragrafi rientrati. Questo è maring e spaziatura tra le righe in una cella non avrà alcun effetto. Creano il rientro solo ai bordi dell'oggetto. Object – questo intero paragrafo, invece di linee in esso. E 'importante non confondersi.
Nei casi in cui un gran numero di righe, tutti che si trovano nello stesso oggetto, si raccomanda il carattere per modificare i parametri di base.
Come aumentare la distanza tra le righe di CSS
La distanza tra le righe di codice HTML, è possibile registrarsi per qualsiasi classe o per tutti i paragrafi nel testo. Se si specifica in questo modo: p {line-height: 20px; } – quindi assolutamente tutti i paragrafi nella pagina saranno stringhe di 20 pixel. Se si desidera in luoghi diversi in diverse dimensioni, si consiglia di procedere come segue.
Noi prescriviamo stili.
.class1 {line-height: 20px; }
.class2 {line-height: 16px; }
.class3 {line-height: 12px; }
Per chiarezza, si aggiunge una cornice, in modo da poter vedere che funziona. In futuro, deve essere rimosso.
Avanti, usiamo queste classi. Il risultato è il seguente.
Si noti che nel terzo caso, la band ha guidato al testo. Tutto a causa del fatto che la dimensione del carattere è maggiore dell'altezza della linea. Pertanto, è importante garantire che tali conflitti non lo erano. Se stai facendo una piccola altezza della linea, rispettivamente di ridurre il tipo di carattere.
Non è raccomandato di fare troppo poco testo e una piccola distanza tra le linee. Poiché nessuno dei gli utenti non saranno in grado di leggere tutto con calma. Ha gli occhi stanchi in fretta. I motori di ricerca anche dire che il testo è user-friendly.
Inoltre, negli ultimi anni v'è una forte enfasi sulla usabilità per gli utenti mobili. Ci raccomandazioni hanno sempre detto che la dimensione del carattere dovrebbe essere normale, non è piccola. Soprattutto colpisce con forza il riferimento. Con le loro piccole dimensioni l'utente sarà difficile da usare navigazione nel sito.
Nel motore di ricerca "Google" è uno speciale strumento che aiuta nell'analisi. E 'molto comodo per i webmaster.
Ecco un esempio dei risultati che possono essere.
Si raccomanda di utilizzare questi suggerimenti, perché questi criteri influenzano i risultati di ricerca.
