HTML'de madde işaretli listeleri hizalamak için CSS kodunu kullanın.
Web tasarımcıları, madde işaretleri ve metin eklemekten daha fazlası için madde işareti listelerini kullanır. Madde işareti listeleri oluşturmak için kullanılan HTML etiketi, bir JavaScript'in slayt gösterisine yüklenmesi için menüler oluşturmak veya görüntüleri düzenlemek için kullanışlıdır. HTML argosunda "sırasız listeler" olarak adlandırılan madde işaretli listelerle bağlantılı olarak basamaklı stil sayfası kodunu kullanmayı öğrenmek, birkaç heyecan verici Web tasarımı olanağının kapısını aralayacaktır.
Aşama 1
Madde işaretli listeyi içeren HTML dosyanızı açın ve kodun üst kısmına doğru ve etiketlerinin arasına bakın. Henüz mevcut değillerse etiket ekleyin. kodunuz içeriyorsa etiketten sonra bir yere etiketleyin ve bu bir CSS dosyasına referans içeriyorsa, bunun yerine o dosyayı açın. CSS kodunuz, etiketlerin arasına veya CSS dosyanızın yeni satırına gider.
Günün Videosu
Adım 2
için "metin hizala" ayarını yaparak tüm madde işaretleri içindeki metni hizalayın.
- etiket. bu
- ve Etiketleri tek bir listenin parçası olarak tanımlamak için. için metni hizaladığınızda
- etiket etrafına sarılır
- etiketi, hizalama her madde işaretindeki metni etkiler ancak listenin kendisini sayfanın soluna veya sağına hizalamaz. "Metin hizalamasını" ayarlamak için bir CSS kodu örneği:
ul {metin hizalama: sağa;}
Madde işaretlerinin metinle birlikte hareket etmediğini unutmayın. Bu durumda mermiler solda kalır.
Aşama 3
Sizin için "kayan" ayarını yaparak tüm listeyi sayfanın soluna veya sağına hizalayın.
- etiket. Bir ekranda "float" sola veya sağa ayarlandığında
- etiketi, madde işaretli listenin tamamını sayfanın soluna veya sağına taşır. Float'ı şu şekilde ayarlayın:
ul {şamandıra: sağ;}
"Yüzme"yi sola veya sağa ayarlayabilirsiniz, ancak merkeze ayarlayamazsınız.
4. Adım
sarın
- etiketler
ve
Sayfanızda madde işaretli listeyi ortalayacak bir sarmalayıcı oluşturmak için etiketler. Ortaya çıkan kodunuz şöyle görünecek:- Liste Öğesi
- Liste Öğesi
bu
etiket hiçbir şeyi kendi başına ortalamaz; her şeyi ortalamak için CSS kullanmalısınız. aranıza aşağıdaki kodu ekleyin
