css width
Css ile ilgili konularından ilk olarak width i anlatmak istedim.
width İngilizce genişlik anlamıdadır. Css de bir öğenin genişliğini de width özelliğini tanımlayarak kullanabiliriz.
Örnek olarak kullanım şu şekilde;
Değer verme
width değerini piksel olarak 300px değerini verdim. Width özelliğini ölçeklendirmek için
auto
px
%
em
cm
mm
kullanabiliriz.
auto
width: auto; olarak ayarlasaydık kullandığımız div veya objenin genişliğinin içeriğine göre Örneğin bir yazının uzunluğu veya resimin büyüklüğüne göre otomatik olarak genişleyebilirdi.
% (percent) yüzdelik ile ayarlamak
width: 100%; olarak bir değer verseydik o içinde bulunduğu div gibi elemanların genişliğine göre bir ölçü alacaktı. yani genişlik 500px ise 500px olarak komple kapatacaktı. width: 50%; deseydik genişlik 500px ise 250px lik bir değer alacaktı.
em
Bu değer 1em = 16px ve 12pt lik bir değere denk geliyor. Değer verirken 1 ve katları olarak değerlendirmeyelim. Çünkü 0.750em veya 3.5em gibi bir değerde verebilirdik.
Bugünlük yazımı burada noktalamak istedim. Bir sonraki yazımda görüşmek dileğiyle...
width İngilizce genişlik anlamıdadır. Css de bir öğenin genişliğini de width özelliğini tanımlayarak kullanabiliriz.
Örnek olarak kullanım şu şekilde;
width: 300px;
height:25px;
background-color: #F59800;Değer verme
width değerini piksel olarak 300px değerini verdim. Width özelliğini ölçeklendirmek için
auto
px
%
em
cm
mm
kullanabiliriz.
auto
width: auto; olarak ayarlasaydık kullandığımız div veya objenin genişliğinin içeriğine göre Örneğin bir yazının uzunluğu veya resimin büyüklüğüne göre otomatik olarak genişleyebilirdi.
% (percent) yüzdelik ile ayarlamak
width: 100%; olarak bir değer verseydik o içinde bulunduğu div gibi elemanların genişliğine göre bir ölçü alacaktı. yani genişlik 500px ise 500px olarak komple kapatacaktı. width: 50%; deseydik genişlik 500px ise 250px lik bir değer alacaktı.
em
Bu değer 1em = 16px ve 12pt lik bir değere denk geliyor. Değer verirken 1 ve katları olarak değerlendirmeyelim. Çünkü 0.750em veya 3.5em gibi bir değerde verebilirdik.
Bugünlük yazımı burada noktalamak istedim. Bir sonraki yazımda görüşmek dileğiyle...
Yorumlar
Yorum Gönder