Bu özellik değerini mutlak olarak ayarlamak, içeriğin etrafındaki düzene bakılmaksızın, nesneyi normal belge akışı mutlak konumlandırmasından çıkarır. Farklı z-indeks özelliklerine sahip diğer nesneler zaten belirli bir konumda yer alıyorsa, birbirlerini etkilemezler, aynı konumda örtüşürler. Nesnenin dış bir yaması (kenarı) yoktur, ancak yine de iç bir yama (patding) ve bir kenar (border) vardır.
Bir nesnenin mutlak konumlanmasını etkinleştirmek için, en az sol, sağ, üst, alt özniteliklerden birini belirtmeli ve bu öznitelik değerini mutlak olarak ayarlamalısın. Aksi takdirde yukarıdaki özöznitelikler varsayılan değer otomatik kullanır, bu da nesnenin normal HTML düzen kurallarına uymasına ve önceki nesneden hemen sonra render edilmesine yol açar.
TRBL özellikleri (ÜST, SAĞ, ALT, SOL) yalnızca pozisyon özniteliği ayarlanmışsa geçerlidir.
Pozisyon ayarlamalısın: mutlak
Eğer ana (sonsuz) konum özniteliğini belirlemezse, mevcut mutlak, tarayıcının sol üst köşesindeki TRBL özniteliği ile birlikte orijinal nokta olarak konumlandırılır
Eğer ebeveyn (sonsuz) konum özelliğini belirliyorsa, mevcut mutlak TRBL özelliğiyle birlikte ebeveynin (son zaman) sol üst köşesine orijinal nokta olarak konumlandırılır.
Pozisyon ayarlanırken: göreceli
Ebeveyn (son) içerik alanının sol üst köşesi, TRBL özniteliği ile birleşen orijinal noktadır (veya ana içerik alanındaki konumlanmış öğenin önceki elemanına göre ofset) ve BODY'nin sol üst köşesi, ana madde olmadan orijinal noktadır. Göreli konumlandırma katmanlı olamaz. Göreceli konumlandırma kullanıldığında, eleman hareket ettirilse de hareket edilmese de orijinal alanını kaplar. Bu nedenle, bir elemanı hareket ettirmek diğer kutuların üzerine yazmasına neden olur.
Genel olarak, web sayfası ortalanmışsa, Absolute kullanırken hata yapmak kolaydır; çünkü web sayfası her zaman çözünürlük boyutuna otomatik uyum sağlar; Absolute ise orijinal nokta olarak tarayıcının sol üst köşesini kullanır ve çözünürlük değişikliği nedeniyle konum değiştirmez. Bazen konteynerin üst ve alt kısmı arasındaki ilişkiyi belirlemek için z-indeksine güvenmek gerekir; değer ne kadar büyükse, üst o kadar yüksek ve sayısal aralık doğal bir sayıdır. Elbette, ebeveyn-çocuk ilişkisinin z-index ile ayarlanamayacağı ve çocuk seviyesinin ebeveynin üstünde veya altında olması gerektiğidir.
Bu özellik değerini göreli olarak ayarlamak, nesneyi normal HTML akışında tutar, ancak konumu önceki nesne göre kaydırılabilir. Göreceli bir konum belirleyicisini takip eden metin veya nesneler, konumlandırılan nesnenin doğal alanını kaplamadan kendi alanlarını kaplar. Buna karşılık, mutlak konumlandırma nesnesinden sonraki metin veya nesne, hedef nesne normal belge akışından uzaklaştırılmadan önce doğal alanını kaplar. Mutlak konumlandırma nesnesinin görüntü penceresinin dışına yerleştirilmesi, bir kaydırma çubuğu belirmesine neden olur. Göreceli konumlandırıcı nesneyi izleme alanının dışına yerleştirmek, kaydırma çubuğu ile görünmez. Aslında, konumlandırmanın temel sorunu, her konumlandırmanın anlamını hatırlamaktır. Göreceli konumlandırma, belge akışına "göreli" olan elementin başlangıç konumudur; mutlak konumlandırma ise en son unsura "göreli" konumlanmış olan ata-elemandır.
İşte eklemeler:
CSS'nin mutlak konumlandırmasını (mutlak) ve göreceli konumlandırmayı bilsem de, ilgili etkileri hiç tek başıma yazmadım!
Yarım günden fazla çalıştıktan sonra tamamlanmış sayılabilir! Bu iki özelliğin bazılarını da çözdüm!
Özet şöyledir:
Önce aşağıdaki katman yapısına bakalım
<body>
<div id=posi>
<div id=rel> Bu katman yalnızca konum:göreceli uygular; Tarz </div>
<div id=abs> Bu katman yalnızca pozisyon:mutlak geçerlidir; Tarz </div>
<div id=sss> <div>stilleri uygulamaz
</div>
</body>
1. mutlak: koltuk tutmaz, akraba: yeri vardır!
Örneğin üst yapı:
id rel olan katmanlar gösterildiğinde bir satırı kaplar! Arkasındaki ABS katmanı sadece bir sonraki satırda görünecek!
ID ABS olan katman görüntülendiğinde, arkasındaki SSS ID'si ile örtüşür!
2. Varsayılan olarak (top ile birlikte konumlanmadan), mutlak (mutlak konumlandırma) ana katman tarafından konumlandırılır
Örneğin, yukarıdaki katman ID'ye sahip ABS ise, TOP ile birlikte konumlandırılmazsa, görüntüleme konumu ana POSI katmanıyla olur (POSI belgenin sol alt köşesinde ve aynı zamanda sol alt köşede bulunur)
3. Üst, alt, sağ, sol ve diğer özellikler birleştirildiğinde, mutlak (mutlak konumlandırma) pencere olarak konumlandırılır ve göreceli konum kendi doluluğuyla dengelenir ve taban olarak kendi doluluk oranı ile dengelenir! Şöyle:
<body>
<div id=posi>
<div id=sss> <div>stilleri uygulamaz
<div id=rel> Bu katman konum:relative uygular; alt:30px; Tarz </div>
<div id=abs> Bu katman yalnızca pozisyon:mutlak geçerlidir; alt:30px; Tarz </div>
</div>
</body>
Yukarıdaki kod:
id rel'li katman yukarı hareket eder ve id SSS ile katmanın üzerine biner
ID ABS'ye sahip katman, pencereden 30 piksel uzakta bir konuma taşınacak ve pencere temel olarak kullanılacak!
4. Üst, alt, sağ, sol ve diğer nitelikleri birleştirirken, mutlak (mutlak konumlandırma) ana katmanı konumlandırma temeli olarak kullanmak istiyorsanız, mutlak veya göreli nitelikleri ana katmana uygulayabilirsiniz! Şöyle:
<body>
<div id=posi style="pozisyon:akraba">
<div id=rel> Bu katman konum:relative uygular; alt:30px; Tarz </div>
<div id=abs> Bu katman yalnızca pozisyon:mutlak geçerlidir; alt:30px; Tarz </div>
</div>
</body>
Yukarıdaki kod: id posi katmanıdır, mutlak özniteliği de kullanabilirsiniz!
ID, REL katmanıdır, etkilenmez ve kendi yer tutucusu tarafından dengelenir!
Id ABS olan katman, konumlandırma temeli olarak POSI katmanının alt kenarına dayanır; eğer POSI katmanının yüksekliği şu anda 30px'ten azsa, ABS katmanı bunu göremeyebilir!
|
Yayınlandı 30.10.2014 14:39:28
|
|
|
