18 Nisan 2013 Perşembe

Çoklu Sütun Özellikleri


Bu işlem, ayrı paragraflar oluşturmak için formatlama sorunları yaşamadan içeriğiniz için çoklu sütunlar oluşturulmasını sağlar. Sütun sayısını istediğiniz miktara göre değiştirebilirsiniz.
Webkit nedir?: WebKit, web tarayıcılarına web sayfalarını işlemesine izin vermek için tasarlanmış bir yerleşim moturudur

Ne işe Yarar?: 
Webkit motoru penceredeki web içeriğini görüntülemek için bir sınıflar kümesi sağlar ve bağlantılar gibi kullanıcı tarafından tıklandığı zaman tarayıcı özellikleri gerçekleştirir.

CSS3 Çoklu Sütunlar

CSS3 ile, metin atma için birden çok sütun oluşturabilirsiniz 

 birden çok sütun özellikleri:
  Sütun sayısı
  Sütun boşluğu
  Sütun kuralı

Çoklu sütunlar oluşturma
Sütun sayısı özelliği sütun sayısının ayrılabilir olduğunu belirtir:

column-countnumber|auto;



div
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
}

<!DOCTYPE html>
<html>
<head>
<style>
.GS
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
}
</style>
</head>
<body>
<div class=“GS">
İçerdeki bu taş ve mermer salonda sizi "VATAN" ve "GALATASARAYLILIK" sevgisi karşılayacaktır. Kapının tam karşısındaki bölümde yalın olmasına karşın  görkemli bir anıtta vatan uğruna şehit düşen Galatasaray Lisesi öğrencilerinin listesi yer almaktadır. Bu anıtı gördükten sonra "fazla söze gerek olmadığını“  siz de anlayacaksınız. Salonun, giriş kapısına göre sağ tarafında, Osmanlı  İmparatorluğu'nun 1910 senesi hudutlarını gösteren bir harita, haritanın her iki yanında ise şehit olan gencecik yurtseverlerin fotoğrafları sıralanmıştır. Ve haritanın üstünde bir ibare: "Galatasaray'ın bu kahraman evlatları, 500 yıllık bu vatan topraklarını kurtarmak için şehid düştüler. Çoğu öğrenciyken  gönüllü olarak katıldıkları savaşlarda şehit olan bu yurtseverler hiçbir zaman  unutulmadı.
</div>
</body>
</html>












Hiç yorum yok:

Yorum Gönder