sabit kutu
Arkadaşlar özel günlerde gün hakkında kısa yorumlarda bulunabileceğimiz. Yada sizin için önem arz eden bir düşünce yada olayı ziyaretçilerinizin görmesini kolay ve kesin kılan küçük ama kullanışlı ve yapması çok kolay bir css uygulamasını anlatacağım.
İşlemimizde iki tür kod bulunuyor. Biri css diğeri html.
Css kodları aşağıda bulunuyor. Kısaca açıklamak gerekirse; position: fixed; kutunun sabit olarak kalmasını sağlıyor. Bu kodu değiştirmeyin.
bottom:1%; right:1%; kodu sırasıyla alttan ve sağdan yüzde birlik boşluk bırakmasını söylüyor. right ı left ile bottom ı top ile değiştirirseniz kutunuzu farklı konumlara taşırsınız.
Css ile alakalı son olarak background arka plan rengini belirler ve border ise kutunun kenarlarına çekilen çizgidir.
.sabitkutu { position:fixed;
bottom:1%;
right:1%;
padding:10px;
font-family:arial;
background:#fffea1;
border:1px solid #fc0; }
Yukarıdaki css kodunu css klasörüne yerleştirin.
Aşağıdaki html kodunu ise kodunun hemen önüne yerleştirin.
<div class="sabitkutu">sabit alan</div>
Son olarak uygulamanın örneği burada bulunuyor. Herkese kolay gelsin.
kaynak
