HTML Listelerinde Metin Formatlama

HTML listeleri CSS ile son derece özelleştirilebilir. Bir web sitesinin menüsünün birçoğu özenle biçimlendirilmiş HTML listeleri tarafından desteklenmektedir. Facebook'un kaynak kodunu gözden geçirme cesaretine sahipseniz, gezinmeye stil kazandırmak için sıralanmamış HTML listeleri kullandıklarını bile görebilirsiniz. Bir listede metni şekillendirecek iki öğe vardır: temel liste etiketi ("

") ve liste öğesi etiketi ("
• "). Tek veya HTML listelerini belirlemek için bir sınıf veya stil de kullanabilirsiniz. Metni biçimlendirme, orada herhangi bir düzeyde işlenebilir.

  1.

  Tercih ettiğiniz düz metin düzenleyicide, .css dosya uzantısını kullanan basamaklı stil sayfası dosyanızı açın. "Ul" (ya da sipariş edilen bir listeyi formatlıyorsanız "ol") veya liste etiketinizin kimliğini belirtin. Örneğin, biçimlendiriyorsanız "

  , "ile başlarsınız:

  ul {}

  2.

  Sıralanmamış listeniz için başka bir biçimlendirme ile birlikte metin biçimlendirmesini ekleyin. Örneğin, bütün metni sıralanmamış bir listede 12pt ve mavi yapmak istiyorsanız, şuna benzer bir şey olabilir:

  ul {font-size: 12pt; renk: # 8CCCC8; }

  3.

  Liste tarzı türünü değiştirin - her listenin başındaki görüntü veya simge. W3Schools.com, liste stili için bir düzineden fazla farklı türü belirtir. Listenin başında bir şey istemiyorsanız, "list-style: none;", örneğin:

  ul {font-size: 12pt; renk: # 8CCCC8; liste tarzı: yok; }

  4.

  Stil sayfanızı ve belgenizi kaydedin, ardından liste öğelerini tarayıcınızda test edin.

  İpuçları

  • Listeyi yatay bir gezinme öğesi olarak kullanmak istiyorsanız,
  • "display: inline" ve "float: left;"

  Uyarı

  • HTML ve CSS dosyalarını düzenlemek için yalnızca Notepad, Notepad ++ veya TextWrangler gibi düz bir metin editörü kullanın.