Css ile Arkaplan Resmi Tanımlamaları

Css ile Sabit Arkaplan Resmi Çoğu websitesinde gördüğümüz güzel bir uygulama ise kullandığımız arkaplan resminin sabit bir şekilde web sayfamızda kalmasıdır. Sayfamız için uygun olduğunu düşündüğümüz bu resmi küçük bir Css kodu ile sayfamızda sabit hale getirebiliriz. Makalemizin giriş kısmında belirttiğimiz gibi arkaplan resmimizi istediğimiz durumlarda sabit hale getirebiliriz. Bunu yapacak olan Css kodunu aşağıya […]

CSS Horizontal Vertical Açılır Menü Oluşturucu – Ul Ol Li

CSS bilginiz iyiyse kendinizde kolayca kodlayabilirsiniz fakat bilenler bilir karmaşık ve zor bir iştir. Bu işlemi hızlıca istediğiniz gibi oluşturabilmeniz için online hizmet veren bir site var. Bu site sayesinde bir çok adı bulunan bu görsel menüyü “CSS Horizontal Vertical Açılır Menü Oluşturucu – Ul Ol Li” süper bir şekilde oluşturabilirsiniz. Siteye gitmek için tıklayın.

CSS Kaydırma – Float ve CSS Clear Özelliği – Clear Property

CSS Kaydırma – Float Bölümleme yaparken kullandığımız div ‘leri, metinleri, görselleri vb. sağa veya sola yaslayabiliriz, bunu da floatözelliği ile yapacağız. Kaydırmalar tam sol ve tam sağ olarak yapılır. Örneğin bir elemanı sola yasladığımızda o mümkün olduğunca en sola yaslanacaktır. left (Sol) ve right (Sağ) olmak üzere iki değeri mevcuttur. .div { float:left; } CSS Clear Özelliği – […]

CSS Arkaplanlar – Backgrounds

Etiketlere arkaplan efektleri vermek için CSS Background özellikleri kullanılır. Background özelliklerini görelim… background-color background-image background-repeat background-attachment background-position CSS Arkaplan Rengi – Background Color “background-color” özelliği HTML/XHTML etiketlerine arkaplan rengi vermek için kullanılır. Aşağıda ki CSS kodu; Tüm ” div “ etiketlerinin arkaplan renklerini gri yapacak, Id Seçicisi “paragraf_stilim” olan etiketin arkaplanını mavi yapacak, Class Seçicisi “ozel_stil” olan tüm etiketlerin arkaplan rengi […]

CSS ile Resimli Listeleme İşlemi

Listemizin sol tarafındaki siyah maddeleme işaretlerinin yerine bir resim koymak istiyoruz. Bu işlemi list-style-image CSS kodu ile yapıyoruz. Kullanımı aşağıdaki şekildedir : ul { list-style-image:url(‘http://i41.tinypic.com/10rk5ua.jpg’); } Bu kodu stil dosyamıza ekledikten sonra şu şekilde bir görüntü ortaya çıkıyor. Peki hiç bir madde işareti görmek istemiyorsak? Bu durumda list-style-image:none; olarak belirlemeliyiz. None ifadesi kullanıldığında herhangi bir işaret görünmez. Bu kullanım da […]

20 Harika CSS3 Menü

1. Sekmeli Navigasyon Download | Demo 2. Dönen Menü Download | Demo 3. Modern Bar Menü Download | Demo 4. İki Seviyeli Koyu Menü 5. CSS3 Animasyonlu Menü Download | Demo 6. Apple Tarzı Navigasyon Download | Demo 7. CSS3 Drop Down Menü Demo 8. Drop Down CSS3 Menü Download | Demo 9. Çok Seviyeli CSS3 Drop Down Menü Download | Demo 10. Koyu Navigasyon Menü Download | Demo 11. Seksi CSS3 Menü Demo […]

CSS Reset Nedir? Ne için gereklidir?

Bildiğiniz üzere piyasada birsürü internet tarayıcısı bulunmaktadır. Bir tasarımcının yaptığı tasarım tüm tarayıcılarda kusursuz bir şekilde görüntülenmesi gereklidir. Kusursuz bir tasarımda bir element her tarayıcıda aynı şekilde görüntülenmelidir. CSS Reset ile css tanımlarından bazıları sıfırlanır ve tüm tarayıcılarda elementler aynı görünümü kazanırlar. Örnek bir reset.css html, body, div, span, applet, object, iframe, h1, h2, h3, […]

Css İpucu: Sayfa Üzerinde Sabit Alanlar Oluşturmak

Css ile oluşturduğumuz bir sınıfı arkaplanda sabit olarak göstermek için Css stil dosyamıza şu kodu girmemiz yeterli; .element { position:fixed; top:2%; right:2%;} Bu kodu ekledikten sonra Xhtml/Html sayfamızda çağırmak içinse; <div class=”element”>Sabit div içinde yer alacak metnimiz</div> kodunu kullanmamız gerekiyor. Böylelikle “element” ismiyle oluşturduğumuz sınıf position:fixed parametresi sayesinde arkaplanda sabit olarak kalacak. Sayfanız aşağı doğru […]

CSS ile Background Özellikleri

Background dendiğinde akla hemen sitemizin zeminini oluşturan alan gelir ama background özelliğini sadece zeminde kullanmayız… Background dendiğinde akla hemen sitemizin zeminini oluşturan alan gelir ama background özelliğini sadece zeminde kullanmayız, mesela şu alanlarda da backgorund  ile sayfamızı şekillendirebiliriz. BODY               { background: white url(http://www.ceviz.net/images/syl.jpg) } BLOCKQUOTE   { background: #ffcc66 } P                     { background: […]

CSS ile Loading.Gif Yapımı

Artık çoğu sitede karşımıza çıkan Yükleniyor (Loading) imajlarıyla sitelerin açılmasındaki zevksiz bekleyişi bir nebze olsun azaltan yapıyı AJAX kullanmadan gerçekleştirmenin yöntemi bu yazıda. Örneğin web sitemizde bulunan resim galerisinde bulunan resimlerin yüklenmeleri esnasında meydana gelecek beklemeleri daha görsel hale getirebilmek için yazacağımız ufak still kodlarıyla bu işe başlayabiliriz. .resim{ background-color: #FFFFFF; background-image: url(loader.gif); background-repeat: no-repeat; background-position: […]