önem

Tablo olmayan tasarım, çoğu web sayfasının sahip olduğu şeydir. Bu, çoğu geliştiricinin bir sayfada görüntü ve metin tasarlaması için CSS sınıflarına bağlı olduğu anlamına gelir. Önceden, hücreleri, satırları ve sütunları olan tablolar bir Web sayfasının görünümünü denetledi. Ancak, tabloları olmayan bir tasarıma sahip olan düzen, bir "div" konteynerinde yer alır. Bir div container, sayfanın bölümlerini HTML kodunun farklı alanlarına yerleştirmenize ve sayfanızın farklı bölümlerini diğer alanları etkilemeden kontrol etmenize olanak tanır.

Dikey format

"Valign" özelliği, içerilen bir nesnenin dikey konumunu kontrol eden HTML dahili satır etiketidir. Örneğin: 50 piksel yüksekliğinde bir div kabınız varsa, "ortadaki" "valign" değerini ayarlamak, içeriği kapsayıcının tepesinden 25 piksel aşağıya yerleştirir. Div kabını farklı bir konuma taşıdığınızda bile, dikey olarak merkezlenecektir.

CSS Sınıfları

Kaskad stilindeki yapraklar, tasarım sınıflarını yapılandırmanıza izin verir, böylece HTML öğelerinizi, her öğenin stilini elle yazmak zorunda kalmadan bir sınıfa bağlayabilirsiniz. Aşağıdakiler, öğeleri dikey olarak hizalayan bir CSS sınıfının bir örneğidir:

div {

dikey hizalama: orta; }

Bu sınıf, içeriği "div" adlı bir divun ortasında dikey olarak hizalar.

hususlar

CSS tasarımı zaman ve uygulama gerektirir. Hizalama bir div için geçersiz kılınmışsa, sayfanın geri kalanının düzenini bozabilirsiniz. Tasarımın okuyucularınızın tarayıcılarında doğru şekilde çalıştığından emin olmak için HTML sayfasını Firefox, Chrome ve Internet Explorer gibi her bir ortak tarayıcıda ilişkili CSS sınıflarıyla açmalısınız.