close

Gwida għall-ifformattjar ta' Listi u Tabelli f'CSS- Proprjetajiet u Eżempji

L-ifformattjar ta' listi u tabelli huwa parti essenzjali mill-wiri ta' informazzjoni fuq il-websajt tiegħek. CSS jipprovdi proprjetajiet u klassijiet biex joħolqu u jippersonalizzaw listi u tabelli skond il-predisposizzjoni tiegħek. Hawnhekk hawn gwida dettaljata dwar kif tifformattja l-listi u t-tabelli f'CSS.

 

Listi tal-ifformattjar

Lista mhux ordnata(ul)

Proprjetà prinċipali: lista ta 'stil tat-tip.

Valuri: none, disc, circle, square.

Eżempju:

ul {  
  list-style-type: disc;  
}

Lista Ordnata(ol)

Proprjetà prinċipali: lista ta 'stil tat-tip.

Valuri: xejn(default), deċimali, low-alpha, upper-alpha, lower-roman, upper-roman.

Eżempju:

ol {  
  list-style-type: decimal;  
}

Lista ta' Definizzjonijiet(dl)

Proprjetà ewlenija: M'hemm l-ebda proprjetà CSS speċifika għall-ifformattjar tal-listi tad-definizzjoni. Madankollu, tista 'stil l-elementi fil-lista billi tuża klassijiet jew proprjetajiet oħra bħal font-size, font-weight, margin, padding, etc.

Eżempju:

<dl>  
  <dt>HTML</dt>  
  <dd>A markup language for creating web pages</dd>  
  <dt>CSS</dt>  
  <dd>A styling language for web pages</dd>  
</dl>  

dt {  
  font-weight: bold;  
}

 

Tabelli tal-ifformattjar

Formattjar tal-Istruttura tat-Tabella

Proprjetà prinċipali: border-collapse.

Valuri: separate(default), collaps e.

Eżempju:

table {  
  border-collapse: collapse;  
}

Formattjar tal-Fruntieri tat-Tabella

Proprjetà prinċipali: border.

Valuri: Valur tal-fruntiera, pereżempju: 1px solid black.

Eżempju:

table {  
  border: 1px solid black;  
}

Ifformattjar tal-Fruntieri taċ-Ċellula

Proprjetà prinċipali: border.

Valuri: Valur tal-fruntiera, pereżempju: 1px solid black.

Eżempju:

td, th {  
  border: 1px solid black;  
}

Allinjament u Spazjar taċ-Ċelloli tal-Tabella

Proprjetajiet ewlenin: text-align, padding.

  • text-align: Valuri ta' allinjament, pereżempju: left, right, center.
  • padding: Valur ta' spazjar fi ħdan iċ-ċelloli, pereżempju: 10px.

Eżempju:

th {  
  text-align: center;  
  padding: 10px;  
}

Sfond u Kulur tat-Test fit-Tabelli

Proprjetajiet ewlenin: background-color, color

  • background-color: Valur tal-kulur tal-isfond, pereżempju: lightgray.
  • color: Valur tal-kulur tat-test, pereżempju: white.

Eżempju:

table {  
  background-color: lightgray;  
  color: white;  
}

Daqs tal-kolonna u tar-ringiela fit-Tabelli

Proprjetajiet ewlenin: width, height.

  • width: Valur tal-wisa ', pereżempju: "100px", "20%".
  • height: Valur tal-għoli, pereżempju: "50px", "10%".

Eżempju:

th {  
  width: 100px;  
  height: 50px;  
}

 

Din hija gwida komprensiva dwar kif tifformattja listi u tabelli f'CSS. Tista 'tippersonalizza l-valuri u l-proprjetajiet biex toħloq stili ta' lista u tabelli li jissodisfaw il-ħtiġijiet tad-disinn tiegħek fuq il-websajt tiegħek.