İki tür site düzeni vardır: tablo ve blok. Ve birincisi basit html sayfaları oluşturmak için daha uygun olsa da, ikincisi, bloklar şeklinde tek tek öğeler eklemeniz gerekiyorsa idealdir.
Talimatlar
Aşama 1
Kendiniz bir blok tasarımı geliştirmenize izin verecek iki teknik vardır: basamaklı stil sayfalarını bir belgeye gömerek veya bunları harici bir kaynaktan bağlayarak. Her ikisi de aynı sonucu verir, dolayısıyla aralarında temel bir fark yoktur. İlk durumda, aşağıdaki kodu style.css dosyasının herhangi bir yerine yapıştırın:
. Blok 1 {
}
Block1 - bloğun adı, başka bir şey yazabilirsiniz. Kıvrımlı parantezler arasında parametreleri şu biçimde belirtin: nitelik adı> iki nokta üst üste> değer> noktalı virgül (kıvrık ayraçtan önce yerleştirilmiş olanlar dahil). Aşağıdaki öğeler yaygın olarak kullanılır:
- genişlik - genişlik (500 piksel, %100, vb.);
- yükseklik - yükseklik (200 piksel, %25, vb.);
- arka plan - arka plan rengi (Sarı, Kırmızı, # 000000);
- dolgu - bloğun içindeki içeriğin etrafını doldurma (0 piksel, %20);
- kenar boşluğu - bloktan dış kenar boşlukları (15 piksel, %40);
- kenarlık - çerçeve (kenarlık: düz 0 piksel siyah;);
- kayan nokta - hizalama (sol, sağ);
- sınır yarıçapı - köşelerin yuvarlanması (sınır yarıçapı: 10 piksel;).
Adım 2
CSS'nin ikinci kullanımında, ve etiketleri arasına stil ekleyin:
. Blok 1 {
}
Ve istediğiniz parametreleri ekleyin.
Aşama 3
Komutu kullanarak bloğu sitede istediğiniz yere yerleştirin:
Blok 1
Sayfayı kaydedin ve yenileyin, görünmelidir. Yükseklik hizalamasının içeriğin ne kadar dolu olduğuna bağlı olarak değişebileceğini unutmayın. Örneğin, 300 pikseli ayarlarsanız, ancak yalnızca bir metin satırı yazarsanız, tam olarak görüntülenmez. Bu, örneğin, bloğun içine yerleştirilmesi gereken gerekli parametrelere sahip bir tablo kullanılarak düzeltilebilir, yani. etiketler arasında ve. Ve sınırların görünmemesi için özniteliği ekleyin
