Blackinci » CSS » Border Çizgi Stilleri
Üye Paneli


Give Me Everything

CSS Hayat İşte Genel Photoshop MyBB Temalar Özgür Yazım

«    Şubat 2012    »
PtSaÇrPrCuCtPz
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 


blackinci.com da bir forum sayfası olsun mu?
Evet Olsun
Hayır Olmasın
Kararsızım
Fikrim yok

admin paneli, ajax, background, css, CSS3, dle, F1, form, forum, giris paneli, gölge, gölgeli yazı, highslide, iphone, md, mybb, mybbdestek, novaboard, oval, Seri 5, seri2, tasarim, tema, transform, vbulletin, Yarış, özellik

Eylül 2010 (4)
Ağustos 2010 (1)
Haziran 2010 (1)
Mart 2010 (4)
Şubat 2010 (2)
Ocak 2010 (1)

Border Çizgi Stilleri

CSS 2.1 de Kullanılan Css Sitilleri ve CSS3 te Yeni Gelen Border Sitilleri

Border Çizgi Stilleri























Css 2.1 De Kullandığımız Borderlerin Toplam 8 sitili var ama Tasarımcılar Olarak Kullanabileceğimiz günü 4 gözle Beklediğimiz CSS3 ile birlikte Bu Rakkam 11 e çıkıyor mevcut sitillerin yanı sora olmayan bir sitil var wave dalgalı çizgi ve diğer yeni gelen diğer ikisi bize tanıdık noktalı çizgi ve kesik çizgi bu ikisinin birleşiminden olan olan bir sitil geliyor tabi CSS3 border konusunda bununlada sınırlı olmayacak artık borderlere background resmi verebileceğiz bu daha sonraki bir konuda detaylı olarak yer vermeyi düşünüyorum şimdi mevcut kullanabildiğimiz 8 sitili örnekle gösterelim


Kullanımı ve Örnekler

#etiket {border-style: dotted;}dotted border Stili - Noktalı Çizgi

#etiket {border-style: dashed;}dashed border Stili - Kesik Çizgi

#etiket {border-style: solid;}solid border Stili - Düz Çizgi

#etiket {border-style: double;}double border Stili - Çift Düz Çizgi

#etiket {border-style: groove;}groove border Stili - İçe Kabarık Çizgi

#etiket {border-style: ridge;}ridge border Stili - Dışa Kabarık Çizgi

#etiket {border-style: inset;}inset border Stili - İçe Gömülü Çizgi

#etiket {border-style: outset;}outset border Stili - Dışa Gömülü Çizgi


Yukardaki gibi bu stiller kullanmak istediğiniz her alanda kullanılabilir css3 ü sabırsızlıkla bekliyoruz
tabiki bu sitilleri bir arada kullanmakta mümkün örnek vermek gerekirse


#etiket {border-style: dotted solid dotted solid;}Hem Noktalı Hem Düz çizgi Stili



Yukarıdaki gibi hem noktalı hemde düz çizgi kullandım tabi dört yön içinde ayrı ayrı çizgi, ayrı ayrı renk, ayrı ayrı genişlik, kullanılabilir bu sizin yaptığınız tasarıma ve hayal gücünüze kalmış bir şey kolay gelsin başka bir konuda görüşmek üzere
24 Ekim 2011 03:57 14cem demiş ki:
ne diyeyim sözün bittiği yer çok teşekkür ederim.

31 Ağustos 2011 00:39 13Özgür demiş ki:
Valla ne zamandır arıyodum.Nasıl teşekkür ediceğimi bilmiyorum.

19 Ocak 2009 12:54 12MRT demiş ki:
emeğine sağlık

28 Ağustos 2008 12:00 11GELİŞTİRİCİ demiş ki:
Emeğine sağlık çok faydalandım

19 May 2008 20:23 10blackinci demiş ki:
css 2.1 de böyle bir özellik yok
ama css3 te borderlere arka plan resmi verebileceğiz tabi tarayıcılar desteklediği zaman

19 May 2008 18:57 9Turku demiş ki:
Hocam çok faydalı oldu benim için teşekkür ederim...

Bir sorum olcak bu şekilde yapıldıgında sadece çizgi görünüyor bunu yanına resim url si eklememiz mümkün değil mi acaba

14 Nisan 2008 15:52 8blackinci demiş ki:
Hayır sizde bir yanlışlık yok yeni CSS3 border stillerini hiç bir tarayıcı desteklemiyor malesef

13 Nisan 2008 20:30 7Fırat demiş ki:
CSS3 çıktı css3'ün özelliklerini firefox ile kontrol ediyorum ama göstermiş oldugunuz border-style:wave; firefoxta çalışmıyor?

acaba benmi yanlış yapıyorum
?

31 Mart 2008 17:24 6blackinci demiş ki:
evet text-decoration kodunda altı çizgili üstu çizgili ve yazı üstü çizgili yapabiliriz

makalenin en sonda demiştim bu border uygulamasını her yerde kullanabiliriz bu tasarımcı arkadaşların hayal gücene kalmış birşey
ama verdiğin örnek çok güzel olmuş eline sağlık teşekkür ederim

31 Mart 2008 17:04 5Arno demiş ki:
Davut abi aklıma gelen birşey daha var istersen onu da makale olarak ekleyiver:

a:hover, a:active {
text-decoration: none;
border-bottom: 1px dotted #000;
}

Şeklinde bir kod ile normalden daha farklı bir link hoverı uygulayabiliyoruz. Kullanımı az olan ve daha şık duran bir kod bu. text-decoration da böyle bişey yok ancak border ile aynı sonucu daha çeşitli olarak verebiliyoruz. Eminim bu tarz hilelerden çokça biliyosundur :)

Edit: Mesela bi tane daha aklıma geldi. Normalde text-decoration ile düz olarak çizgi çektiğimizde linkin altına bu çizginin rengi ile linkin rengi aynı oluyor. Ama bu yöntemle çizgi çekersek farklı renkler verip değişik bir şey yaratabiliriz :)


Sessiz Kalma Sende Yorum Yap

Son Yapılan 10 Yorum
  • Konu
  • Yazar
  • Yorum
  • Üye Giriş Paneli Tasarımları
  • demiş ki 
  • İşime çok yaradı Saol arkadaşım
  • Üye Giriş Paneli Tasarımları
  • demiş ki 
  • çok teşekkürler kardeşim renk paylaşımları ve üye paneli paylaşımları işime yaradı sağol
  • MyBB için css ile alt forumları 2 blok h ...
  • demiş ki 
  • Selamlar
    Ben internete girmek icin firefox kullanmaktayim. Ancak internet explorerda birden cok sayfa actigimda firefox cokmekte. Bu tarz bir problemle karsilasan arkadaslar varsa ve bana yardimci olurlarsa cok sevinirim.
    Tesekkurler...
  • Üye Giriş Paneli Tasarımları
  • demiş ki 
  • yaa ben siteme uygulayamıyorum yardım edn lütfen sad
  • blackinci DLE Seri 1
  • demiş ki 
  • v2 yi bekliyoruz saygılar. winked
  • Css ile Aktif Menü Buton Yapımı
  • AsparagasHaber.net demiş ki 
  • İşime yaradı kullanacagım tesekkur ederım..
  • Css ile Aktif Menü Buton Yapımı
  • Agah demiş ki 
  • ÇOOOOOOOOOOOOOKKK SAĞOLUN EMEĞİNİZE SAĞLIK!!!!!!!!!!! smile
  • MyBB için css ile alt forumları 2 blok h ...
  • blackinci demiş ki 
  • Ceydaa_Gunactii,
    Ceyda hanım bilgisayarınızın windows update kısmından güncelleyebilirsiniz
  • MyBB için css ile alt forumları 2 blok h ...
  • demiş ki 
  • Yardim Lütfen
    internet explorerimi guncellemek istiyorum ancak bunu nasil yapacagimi bilemiyorum. Bu konuda bana yardimci olabilecek arkadaslar var mi acaba?
    simdiden tesekkurler.

Yukarı İletişim RSS Takip İstatistikler Site İçeriği

Copyright © 2007 - 2011 DLE Blackinci Edition Seri 2