Nwlapcug.com


Come aumentare la spaziatura interna su un elenco puntato



L'aggiunta di imbottitura per elenchi puntati è utile quando è necessario modificare l'aspetto predefinito, che un browser può rendere il vostro codice di elenco non ordinato (rendering viene eseguito un elenco ordinato con numeri, lettere o numeri romani) e/o quando si desidera aggiungere la spaziatura tra il proiettile e il testo nel tuo contenuto. Un metodo semplice ed efficace per farlo è quello di utilizzare la codifica CSS (foglio di stile CSS) e applicarlo a un elenco specifico o per tutti i tuoi elenchi non ordinati (o ordinati). Questo codice può essere inserito sia nel documento html o in un file separato, con riferimento.

Istruzioni

1

Il primo passo è quello di determinare dove il tuo elenco afferrerà il codice CSS da. Entrambi i modi ottenere nidificati nel tag < head >. È possibile inserire il codice CSS direttamente nel documento HTML. Ciò è utile se si dispone di poche righe di codice CSS da aggiungere. Si può anche chiedere il documento HTML per ottenere il codice CSS da un documento esterno. Ecco come appare:

CSS direttamente a < head >

< head >

< style type = "text/css" >

<!...

UL {

padding: 5 px;

}

-->

< / stile >

< / head >

Documento CSS fa riferimento a < head >

< head >

< link href = "URL o il percorso del file/nameofcssdocument.css" rel = "stylesheet" type = "text/css" / >

< / head >

2

Il codice CSS stesso è molto facile, ma hai ancora bisogno di fare un'altra scelta: È il tuo codice andando ad per incidere tutti gli elenchi non ordinati, o una lista non ordinata in una sezione specifica del contenuto?

Per tutti gli elenchi non ordinati, è necessario inserire il codice nel foglio di stile CSS. Questo esempio ci istruisce per aggiungere 5 pixel per la spaziatura interna di tutti gli elenchi puntati:

UL {

Imbottitura: 5 px;

}

3

Potrebbe essere un documento con diversi elenchi puntati e si consiglia di modificare l'aspetto di molti o di uno degli elenchi. In tal caso, è possibile creare un tag ID nel tuo CSS. Il tag # indica che l'elemento CSS è un ID. Ecco il codice:

specialpadding () {

padding: 5px;

}

Il passaggio successivo consiste nel fare riferimento a questo nel codice in un elenco che si desidera applicare i CSS Ecco il codice di esempio:

< ul id = "specialpadding" >

elemento < li > 1 </li >

elemento < li > 2 </li >

</UL >

4

È possibile aggiungere spaziatura interna a sinistra o a destra del proiettile. Per aggiungere a sinistra, utilizzare spaziatura interna sinistra o imbottitura-diritto, ad esempio:

UL {

padding-left: 5 px;

}

Consigli & Avvertenze

  • È possibile denominare il vostro ID qualsiasi cosa che desideri, basterà cambiare #specialpadding, con tutto ciò che si desidera denominare il tuo ID.
  • L'unità di imbottitura può essere in pixel, punti o. em, qualsiasi misura è adatto per il vostro disegno.
  • Ricordarsi di chiudere tutti i tag e il codice CSS per il rendering corretto. Codice CSS si chiude con un ";" seguita da un "}".