Php & Resources

visiblity

Uygulandığı elemanın görünürlüğünü ayarlar. Alacağı değer visible ise eleman görünür olacaktır, hidden ise eleman görünmez olacaktır ve eğer inherit ise elemanın içerisinde bulunduğu diğer block elemanına göre hareket edecektir.

P { visibility : visible;}
.alan { visibility : hidden; }

overflow

Overflow özelliği elemanın içeriğini eleman sınırlarına sığmadığı durumlarda nasıl bir durum sergileceğini belirtir. visible değeri kullanıldığında eleman içeriğine sığmayan kısımlar görünür olacaktır, hidden değeri kullanıldığında eleman içerisine sığmayan kısımlar görünmez olacaktır. scroll değeri kullanıldığına kaydırma çubukları görüntülenir eğer browser kaydırma çubuklarını göstermezse bile alan içerisinde yazılar kaydırılabilecektir ve auto değeri kullanıldığında ise browser duruma göre kendi ayarlamasını yapacaktır.

P { overflow : auto;}
.aciklamalar { overflow: visible;}

clip

Clip özelliği ile uygulandığı elemanın istenilen kenarlarında kırpmalar yapılabilir. Bunun anlamı eğer istenirse mesela üstkenardan 1 santimlik bir kısım kesilebilir. Kullanımı :

P { clip :rect ( üst sağ alt sol);}

Şeklindedir. Burada bir dikdörtgen şekline göre kırpma değerleri veriliyor. Burada üst değeri dikdörtgenin üsten başlayacağı değeri, sağ değeri dikdörtgenin sağa doğru nekadarlık bölümünün gösterileceğini, alt değeri dikdörtgenin yüksekliğini ve sol değeri ise dikdörtgenin solkenara göre nekadar uzaklıktan başlayacağını belirtir.

Mesela gösterilecek alanın elemanın enüstünden başlamasını istiyorsak üst değerini 0, sağa doğru 5 santimlik bir genişliğin gösterilmesini istiyorsak sağ değerini 5cm aşağı doğru gösterilecek yüksekliğin 3 santim olmasını istiyorsak alt değerini 3cm ve dikdörtgenin sol kenarının elemanın başlangıç yerinden olmasını istiyorsak sol değrini 0 yapmalıyız. Bu işlem sonucu şu ifade oluşur:

P { clip:rect: 0 5cm 3cm 0);}

z-index

Elemanın sayfa içerisindeki derinliğini belirtir. Anlamı eğer birkaç eleman üst üste geldiğinde hangisinin üste olacağını tanımlamaktır. Alabileceği değerler auto ve tamsayıdır. Tamsayı değeri yükseldikçe eleman en üste görüntülenecektir.

P { z-index: auto; }

Şimdi bir örnek üzerinde konumsal özellikleri görelim.

DIV {
	position : relative;
	top : 10;
	left: 50;
	width:400;
	height:50;
	background-color: silver;
	border : 1 solid red;
	visibility:visible;
	overflow:scroll;
	z-index:auto;
	}