Gli elenchi CSS sono molto utili per raggiungere un insieme di punti numerati o puntati. Questo articolo ti mostrerà come controllare il tipo, la posizione e lo stile di utilizzando CSS. I seguenti puntatori saranno trattati qui,
- Proprietà CSS
- La proprietà del tipo di elenco
- Elenchi CSS: programma di esempio
- Valori dei marker perNella proprietà list-style-position
Quindi iniziamo allora,
Elenchi CSS
Proprietà CSS
Esistono cinque diverse proprietà CSS in cui è possibile utilizzarlo per controllare gli elenchi:
- List-style-type: ci permette di controllare la forma o l'aspetto del marker.
- List-style-position: specifica che è necessario un punto lungo per andare a capo su una seconda riga o deve allinearsi con la prima riga o iniziare con il marker.
- List-style-image: specifica che un'immagine per il marker deve essere aggiunta o resa più attraente piuttosto che i punti elenco o numerati.
- Stile elenco: mostra la scorciatoia per le proprietà precedenti.
- Marker-offset: specifica la distanza tra il marker e il testo inserito nella lista.
Qui gli elenchi comunemente usati sono: list-style-type e list-style-position. È stato spiegato di seguito
override e sovraccarico in java
Andando avanti con questo articolo sugli elenchi CSS
La proprietà del tipo di elenco
Nella proprietà del tipo di stile di elenco ti consente di controllare la forma e lo stile dei punti elenco o dell'indicatore nel caso di elenco non ordinato. Nel caso di elenco ordinato si tratta di caratteri di numerazione.
Di seguito la tabella che rappresenta per gli elenchi non ordinati:
Valore | Descrizione |
Nessuna | N / A |
Disco | È riempito nel cerchio. (Predefinito) |
Cerchio | È un cerchio vuoto. |
Piazza | È riempito nella piazza. |
Di seguito la tabella che rappresenta per gli elenchi ordinati:
Valore | Descrizione | Esempio |
Decimale | È un numero | 1,4,3 |
Zero iniziale decimale | 0 prima del numero effettivo | 01, 04, 03 |
Alfa inferiore | Sono caratteri alfanumerici minuscoli. | a, b, c, d |
Alfa superiore | Sono caratteri alfanumerici maiuscoli. | A, B, C, D |
Minuscolo romano | Si tratta di numeri romani minuscoli. | i, ii, iii, iv, v |
Maiuscolo | Sono numeri romani maiuscoli. | I, II, III, IV, V |
Greco inferiore | Marker è in greco inferiore | alfa, gamma |
Latino inferiore | Marker è in latino minuscolo | a, b, c, d |
Latino superiore | Il pennarello è in latino superiore | A, B, C, D |
Andando avanti con questo articolo sugli elenchi CSS
Elenchi CSS: programma di esempio
- Giava
- Pitone
- Angolare
- Giava
- Pitone
- Angolare
- Giava
- Pitone
- Angolare
- Giava
- Pitone
- Angolare
- Giava
- Pitone
- Angolare
Produzione
Andando avanti con questo articolo sugli elenchi CSS
La proprietà list-style-position
Valori dei marker per la proprietà In list-style-position
Nella proprietà list-style-position mostra che il marker deve apparire all'interno o all'esterno della casella contenente i punti elenco. Questo può avere uno dei due valori:
Valore | Descrizione |
Nessuna | N / A |
Dentro | In questo caso, se il testo va nella seconda riga, il testo andrà a capo sotto il marcatore e mostrerà anche dove sarebbe iniziato il testo se gli elenchi avessero un valore all'esterno. |
al di fuori | In questo caso, se il testo va nella seconda riga, il testo sarà allineato con l'inizio della prima riga. |
Esempio:
- Matematica
- Scienze sociali
- Fisica
- Matematica
- Scienze sociali
- Fisica
- Matematica
- Scienze sociali
- Fisica
- Matematica
- Scienze sociali
- Fisica
Produzione
Questo ci porta alla fine di questo articolo sugli elenchi CSS.
Dai un'occhiata al nostro che viene fornito con formazione dal vivo con istruttore e esperienza di progetto nella vita reale. Questa formazione ti consente di acquisire competenze per lavorare con tecnologie web back-end e front-end. Include formazione su sviluppo Web, jQuery, Angular, NodeJS, ExpressJS e MongoDB.
Hai domande per noi? Per favore menzionalo nella sezione commenti dell'articolo e ti risponderemo.