Esistono diversi metodi di rientro del testo. Tuttavia, per la compatibilità con più browser e l’accessibilità, discutiamo i metodi più diffusi di rientro del testo sulla tua pagina web.
Metodo consigliato con CSS&HTML
Per indentare il testo o un paragrafo, il metodo più comunemente usato e consigliato sarebbe quello di utilizzare CSS. Di seguito sono riportati diversi esempi di come i CSS possono indentare il testo., Ognuno di questi esempi verrà inserito tra i tag HTML<head></head>.
Il seguente esempio creerebbe una classe di stile denominata “tab” che indenta il testo e il paragrafo 40 pixel da sinistra.
<style type="text/css"><!-- .tab { margin-left: 40px; }--></style>
una Volta che il codice sopra è il <testa> sezione, è possibile utilizzare aggiungendolo al paragrafo (<p> tag, come mostrato.,
<p class="tab">Example of a tab</p>
Includere CSS nel documento HTML, come mostrato sopra, è indicato come CSS “in-line”. È utile per apportare rapidamente modifiche, ma a lungo termine è difficile cambiare in seguito.
Invece, puoi prendere tutto il tuo codice CSS e posizionarlo in un file separato, con l’estensione .CSS. Quindi, puoi collegarti a questo file da qualsiasi documento HTML e quel documento può utilizzare quelle proprietà CSS. L’utilizzo di un file CSS esterno semplifica la modifica del CSS in seguito, poiché tutto il CSS è definito in un unico punto.
<link rel="stylesheet" Type="text/css" href="http://www.example.com/basic.css">
Una volta questo .,il file css è stato creato, modifica il file e aggiungi lo stesso codice CSS, escludendo lo stile <> e commenta i tag in esso, come mostrato.
.tab { margin-left: 40px; }
Infine, una volta completati i passaggi precedenti, è possibile tab qualsiasi testo utilizzando lo stesso<p class=”tab” > esempio che abbiamo mostrato sopra.
Esistono anche altre forme di rientro. Ad esempio, se si desidera solo indentare la prima riga di un paragrafo, invece di utilizzare la riga CSS sopra, utilizzare la riga seguente.,
.tab { text-indent:40px }
Puoi anche indentare usando una percentuale. Ad esempio, invece di indentare di 40px (pixel), è possibile sostituire il rientro con il 5% per indentare il testo del 5% della vista corrente. È inoltre possibile utilizzare uno spazio em quando si definisce la larghezza di un rientro.
Puoi anche cambiare il rientro da sinistra a destra cambiando margin-left a margin-right.
Metodo consigliato utilizzando HTML
È possibile ottenere gli stessi risultati sopra con uno stile in linea all’interno di HTML., Mentre si utilizza l’esempio CSS sopra può rendere più facile la manutenzione su più pagine Web, se è necessario utilizzare uno stile solo una volta è possibile utilizzare il seguente esempio.
<p style="margin-left: 40px">This text is indented.</p>
In questo primo esempio, tutto il testo nel tag paragrafo è rientrato 40 pixel da sinistra. Eventuali altri tag di paragrafo non sono rientrati.
<p style="text-indent: 40px">This text is indented.</p>
In questo secondo esempio, solo la prima riga di testo del paragrafo sarà rientrata di 40 pixel da sinistra. Eventuali righe di testo aggiuntive in quel paragrafo non sono rientrate.,
Puoi anche indentare usando una percentuale. Ad esempio, invece di indentare di 40px (pixel), è possibile sostituire il rientro con il 5% per indentare il testo del 5% della vista corrente. È inoltre possibile utilizzare uno spazio em quando si definisce la larghezza di un rientro.
Puoi anche cambiare il rientro da sinistra a destra cambiando margin-left a margin-right.
Metodo alternativo
Un altro metodo comune (ma improprio) per indentare il testo è con i tag<blockquote >, come mostrato nell’esempio seguente., Sebbene questa sia una soluzione più semplice, introduce problemi di accessibilità. Questo tag serve per citare il testo e non per indentare.
<blockquote>This text would be indented</blockquote>
Ulteriori informazioni
- È necessario indentare durante la scrittura di codice HTML?
- Come creare spazio extra in HTML o una pagina web.
- Vedere la definizione di rientro per informazioni e collegamenti correlati.
- HTML e web design aiuto e supporto.
