Boyut Tanimlama Ozellikleri
Boyut Tanımlama ÖzellikleriBoyut Tanımlama Özellikleri
Sırasıyla boyut tanımlama özelliklerini aşağıda inceleyelim..
Genişlik (width)
Blok seviyeli ve yerleştirilen elemanların (örn: img, input, textarea gibi..) tümü genişlik değeri alır. Başlangıçtaki genişlik değerleri auto yani elemanların kendi genişliğidir. Alabileceği değerler genişlik ve yüzde değerleridir.
Örnek kullanımı aşağıdaki gibidir;
p {width: 300px}
p {width: 30%}
p {width: 30%}
Genişlik (width)
Blok seviyeli ve yerleştirilen elemanların (örn: img, input, textarea gibi..) tümü yükseklik değeri alır. Başlangıçtaki yükseklik değerleri auto yani elemanların kendi yüksekliğidir. Alabileceği değerler genişlik ve yüzde değerleridir.
Örnek kullanımı aşağıdaki gibidir;
p {height: 300px}
p {height: 30%}
p {height: 30%}
Maksimim Genişlik (max-width)
Elemanın maksimim alabileceği genişlik sınırını belirlemek için bu özelliğimizi kullanırız. IE6 malesef bu özelliği desteklemiyor. Belirlediğimiz değerin üstündeki değerler otomatik bu değere düşürülürken genişlikleri bu değerin altında kalanların genişlikleri yine aynı kalır. İşte en güzel yanıda budur zaten bu özelliğin
Örnek kullanımı aşağıdaki gibidir;
img {max-width: 800px}
Maksimim Yükseklik (max-height)
Elemanın maksimim alabileceği yükseklik sınırını belirlemek için bu özelliğimizi kullanırız. IE6 malesef bu özelliği desteklemiyor. Belirlediğimiz değerin üstündeki değerler otomatik bu değere düşürülürken yükseklikleri bu değerin altında kalanların yükseklikleri yine aynı kalır. İşte en güzel yanıda budur zaten bu özelliğin
Örnek kullanımı aşağıdaki gibidir;
img {max-height: 800px}
Minumum Genişlik (min-width)
Elemanın minimum alabileceği genişlik sınırını belirlemek için bu özelliğimizi kullanırız. IE6 malesef bu özelliği desteklemiyor. Belirlediğimiz değerin altındaki genişlikler otomatik olarak belirlediğimiz değer olurlar. Belirlediğimiz değerin üstündeki genişlik değerlerinde bir oynama olmaz.
Örnek kullanımı aşağıdaki gibidir;
img {min-width: 10px}
Minumum Yükseklik (min-height)
Elemanın minimum alabileceği yükseklik sınırını belirlemek için bu özelliğimizi kullanırız. IE6 malesef bu özelliği desteklemiyor. Belirlediğimiz değerin altındaki yükseklikler otomatik olarak belirlediğimiz değer olurlar. Belirlediğimiz değerin üstündeki yükseklik değerlerinde bir oynama olmaz.
Örnek kullanımı aşağıdaki gibidir;
img {min-height: 10px}