Geri git   Van.GEN.TR Forum | Yerel Van Forumu > Bilgisayar > CSS

CSS CSS nedir, CSS örnekleri, çözümleri

Cevapla
 
Konu Araçları Stil
Alt 24/04/07, 00:19   #1
gokhanaygun
Tuğgeneral
 
gokhanaygun - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: Apr 2007
Bulunduğu yer: VAN
Yaş: 37
Mesajlar: 924
Tecrübe Puanı: 26 gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold gokhanaygun is a splendid one to behold
Standart CSS ile <hr /> Stil Vermek

CSS ile birlikte kodlama yaparken bir çok yerde <hr/> etiketi yerine elementlerin üst ve alt kenarlık değeri ataması yapılarak kodlama yapılmaktadır, bunun yerine <hr /> etiketini kullanabiliriz. <hr / > daha kolay eklenir ve css desteklemeyen araçlarda sayfa görünümünün bozulmasını engeller.


<hr> elementinin kullanımı da kolaydır. <hr> elementinin tek sorunu farklı web tarayıcılarında farklı algılanmasıdır burada biz hepsine aynı göstermeye çalışacağız. Aşağıdaki kodlar IE5+, Opera5+ ve FF1.0+ test edilmiştir.

Bu konuyu yazmamın sebebi RSS besleyicimi feedburner’a ekledikten sonra sağ kolonun üstüne RSS besleyici ikonu ve linki eklemem ve altına ayraç olarak <hr /> etiketini koyduktan sonra karar verdim. Görünüm hoş olmayan etiketi nasıl düzenlerim diye araştırdım ve sonucu sizlerle paylaşmak istedim.

<hr> Elementi hangi özellikleri destekliyor
width ve height değerini tüm web tarayıcıları destekliyor.
border özelliği Explorer ve Firefox destekliyor. Opera desteklemiyor.
IE color özelliğini destekliyor.
Firefox ve Opera background-color özelliğini destekliyor.
Tüm tarayıcılar background-image özelliğini destekliyor ancak Explorer ve Opera’da bazı sorunları var.
hr {
border: 0;
width: 80%;
}
Bu kodlama IE ve Opera’da düzgün görünecektir. Ancak Firefox’ta görünmeyecektir. background-color ekleyerek kodumuzu Firefox’a da uygun hala getiriyoruz.

hr {
color: #f00;

background-color: #f00;

height: 5px;
}
<hr / > elementine stil ataması yaparken color ve background-color özelliklerin her ikisini de kullanmalıyız. Yüksekliği 3px’in altındaki değerler için Opera’nın eski sürümleri sorun çıkarıyor.

<hr /> hizalama
<hr /> etiketini hizalamada IE için text-align özelliği, Firefox ve Opera için margin özelliği kullanılır.

hr {
text-align: right; /* ie icin */
margin-right: 0; /* diger brovserlar icin */
}
<hr> etiketini <hr /> şeklinde kullanmak Xhtml kuralları açısından önemlidir. Bildiğiniz gibi Xhtml’de her etiket mutlaka kapatılmalıdır. Eğer etiketin bir kapatma etiketi yoksa kapama işaretinden önce bir bölme işareti(/) konarak bu işlem gerçekleştirilir. Örn: <img src="" />, <br />, <meta /> gibi.

<hr/> resim kullanmak
Web sitelerinde bölümleri ayırmak için basit resimler kullanırız. Bu amaçla <hr /> elementini kullanabiliriz. Bu işlem için background-image özelliğini kullanmalıyız. Tabi bir kaç sorunumuz çıkacaktır farklı web tarayıcılarda. Firefox gayet güzel çalışırken IE6- ve Opera’nın eski sürümlerinde sorun çıkarır. resmin etrafında kenarlık çıkarır. bunu engellemek için aşağıdaki şekilde kodlamamızı yapmalıyız.

<div class=”hr”><hr /></div>
ve CSS kodu

div.hr {
height: 15px;
background: #fff url(/images/ayrac_zr.gif) no-repeat scroll center;
height:28px;
width:180px;
}
div.hr hr {
display: none;
}
Tüm web tarayıcılarında sorunsuz çalışacaktır. Yukarıdaki kodda <hr /> etiketi bir <div> içine alarak css ile <hr /> etiketi görünmez yapılarak esnek bir çözüm sağlanmıştır. Fazladan bir katman eklemek standartlara uygun kodlama için istenmeyen bir durum olsa da kodlama esnekliği ve tüm web tarayıcılarında aynı sonucu vermesi nedeni ile kullanılabilir bir kodlamadır.

Burada bir iki ufak sorun var. Birincisi uygulanan zemin resmi çıktı alırken görünmemesidir. Bunun için yazcı için CSS kodlarken bu özelliği es geçmeliyiz. İkincisi <hr> elementine margin ve/veya padding tanımı yaptığımızda bazı web tarayıcılarında kaymalara neden oluyor, bu sorunu çözmek için margin ve/veya padding değerini <div> vermeliyiz.
gokhanaygun isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Konu Sayısı: 187
Alt 01/03/08, 22:12   #2
Neutralizer
Yasaklı kullanıcı
 
Neutralizer - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: Jan 2008
Bulunduğu yer: İstediğin yerden
Mesajlar: 1.883
Tecrübe Puanı: 0 Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute Neutralizer has a reputation beyond repute
Standart

paylaşım için sağol
Neutralizer isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Konu Sayısı: 316
Takımınız:
Alt 14/03/08, 20:40   #3
Bur2
Korgeneral
 
Bur2 - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: Oct 2007
Bulunduğu yer: evde :)
Yaş: 45
Mesajlar: 2.544
Tecrübe Puanı: 51 Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute Bur2 has a reputation beyond repute
Standart

paylaşım için tşkler
__________________

[Bu Adresi (link) Görme Yetkiniz Yok BEDAVA'ya Üye Ol Sitemizden Faydalan....]

[Bu Adresi (link) Görme Yetkiniz Yok BEDAVA'ya Üye Ol Sitemizden Faydalan....]


Bur2 isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Konu Sayısı: 497
Takımınız:
Alt 01/08/08, 12:51   #4
firari
Mareşal
 
firari - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: Sep 2007
Mesajlar: 5.835
Tecrübe Puanı: 105 firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute firari has a reputation beyond repute
Standart

tşkler...
__________________



firari isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Konu Sayısı: 613
Takımınız:
Cevapla


Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)
 

Yetkileriniz
Yeni Mesaj yazma yetkiniz Aktif değil dir.
Mesajlara Cevap verme yetkiniz aktif değil dir.
Eklenti ekleme yetkiniz Aktif değil dir.
Kendi Mesajınızı değiştirme yetkiniz Aktif değildir dir.

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-KodlarıKapalı
Gitmek istediğiniz klasörü seçiniz


Bütün Zaman Ayarları WEZ +3 olarak düzenlenmiştir. Şu Anki Saat: 09:24 .


Powered by vBulletin
Copyright © 2000-2007 Jelsoft Enterprises Limited.
Sitemap
6, 5, 3, 7, 8, 9, 10, 11, 12, 13, 14, 15, 113, 16, 17, 18, 19, 81, 20, 27, 22, 23, 24, 25, 26, 48, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 43, 136, 40, 58, 45, 42, 44, 46, 47, 53, 54, 55, 56, 57, 59, 60, 70, 61, 62, 63, 64, 65, 66, 68, 69, 71, 72, 74, 75, 76, 77, 78, 79, 80, 82, 83, 96, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 98, 97, 100, 101, 102, 103, 106, 104, 105, 112, 109, 108, 107, 110, 111, 114, 115, 118, 116, 117, 119, 148, 154, 124, 165, 122, 120, 123, 121, 150, 153, 125, 128, 129, 131, 132, 133, 134, 135, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 151, 149, 202, 175, 164, 152, 167, 155, 156, 157, 158, 159, 160, 161, 162, 163, 195, 169, 166, 168, 170, 171, 172, 199, 174, 173, 196, 200, 176, 177, 180, 178, 179, 182, 189, 187, 184, 186, 191, 192, 193, 194, 197, 198, 201, 203, 229, 204, 205, 206, 207, 208, 209, 210, 211, 212, 213, 214, 215, 216, 217, 218, 219, 220, 221, 222, 223, 224, 236, 231, 232, 233, 234, 235, 237, 240, 239, 241, 243, 242, 244,