Cum se utilizează cel mai bine listele CSS?



Acest articol vă va prezenta listele CSS și vă va ajuta să înțelegeți cum funcționează stilul listei CSS cu o demonstrație.

Listele CSS sunt foarte utile pentru a ajunge la un set de puncte numerotate sau marcate. Acest articol vă va arăta cum să controlați tipul, poziția, stilul folosind CSS. Următorii indicatori vor fi acoperiți aici,

Deci, hai să începem atunci,





Liste CSS

Proprietăți CSS

Există cinci proprietăți CSS diferite în care îl puteți utiliza pentru a controla listele:

  • List-style-type: Ne permite să controlăm forma sau aspectul markerului.
  • Listă-stil-poziție: specifică faptul că este necesar un punct lung pentru a se înfășura pe o a doua linie sau ar trebui să se alinieze cu prima linie sau să înceapă cu marcatorul.
  • List-style-image: specifică faptul că o imagine pentru marker ar trebui adăugată sau făcută mai atractivă, mai degrabă decât gloanțele sau punctele numerotate.
  • Stil list: arată stenograma la proprietățile precedente.
  • Marker-offset: specifică distanța dintre marker și textul introdus în listă.

Aici lista frecvent utilizată este: list-style-type și list-style-position. A fost explicat mai jos



Continuăm cu acest articol despre listele CSS

Proprietatea de tip list-style

În proprietatea de tip listă-stil vă permite să controlați forma și stilul punctelor glonț sau ale marcatorului în cazul listei neordonate. În cazul listei ordonate este vorba de numerotarea caracterelor.

Sub tabelul care reprezintă listele neordonate:



Valoare Descriere
Nici unul N / A
Disc Este completat în cerc. (Implicit)
Cerc Este un cerc gol.
Pătrat Este umplut în pătrat.

Sub tabelul care reprezintă listele ordonate:

Valoare Descriere Exemplu
Zecimal Este un număr1,4,3
Zero de conducere zecimal 0 înainte de numărul real01, 04, 03
Alfa inferior Este vorba de caractere alfanumerice minuscule.a, b, c, d
Alfa superior Este vorba de caractere alfanumerice majuscule.A, B, C, D
Română inferioară Este cu cifre romane minuscule.i, ii, iii, iv, v
Romana superioară Este cu cifre romane majuscule.I, II, III, IV, V
Grecul inferior Marker este în greacă mai micăalfa, gamma
Latină inferioară Marker este în latinăa, b, c, d
Latină superioară Marker este în latină superioarăA, B, C, D

Continuăm cu acest articol despre listele CSS

Liste CSS: Program de probă

 
  • Java
  • Piton
  • Unghiular
  • Java
  • Piton
  • Unghiular
  1. Java
  2. Piton
  3. Unghiular
  1. Java
  2. Piton
  3. Unghiular
  1. Java
  2. Piton
  3. Unghiular

Ieșire

este masterat o diplomă postuniversitară

Ieșire - Liste CSS - Edureka

Continuăm cu acest articol despre listele CSS

Proprietatea list-style-position

Valori de marker pentru Proprietatea de poziție în stil listă

În proprietatea list-style-position, arată că markerul trebuie să apară în interiorul sau în afara casetei care conține punctele glonț. Aceasta poate avea una dintre cele două valori:

Valoare Descriere
Nici unul N / A
Interior În acest caz, dacă textul intră în a doua linie, atunci textul se va înfășura sub marker și va arăta, de asemenea, de unde ar fi început textul dacă listele ar avea o vale în exterior.
in afara În acest caz, dacă textul intră în a doua linie, textul va fi aliniat cu începutul primei linii.

Exemplu:

 
  • Matematica
  • Stiinte Sociale
  • Fizică
  • Matematica
  • Stiinte Sociale
  • Fizică
  1. Matematica
  2. Stiinte Sociale
  3. Fizică
  1. Matematica
  2. Stiinte Sociale
  3. Fizică

Ieșire

Acest lucru ne aduce la sfârșitul acestui articol despre listele CSS.

Verificați-ne care vine cu instruire live condusă de instructor și experiență de proiect din viața reală. Acest training vă face să aveți abilități în a lucra cu tehnologii web back-end și front-end. Acesta include instruire în domeniul dezvoltării web, jQuery, Angular, NodeJS, ExpressJS și MongoDB.

Ai o întrebare pentru noi? Vă rugăm să o menționați în secțiunea de comentarii a articolului și vă vom răspunde.