CSS

CSS ile Fare İmlecini Değiştirmek (Mouse Cursor)

Web sayfalarında CSS kullanarak fare imlecini değiştirebilirsiniz. Bunun için ilk olarak fare imlecinin nerede değişmesi gerektiğini belirlemeniz gerekiyor.

Not: Eğer tüm sayfada değişmesini istiyorsanız bunun için <body> tagını kullanmanız gerekiyor.

Fare imlecini deÄŸiÅŸtirmek istediÄŸiniz yerde yazmanız gereken kod ise style=”cursor:hand;” ÅŸeklindedir. ÖrneÄŸin tüm sayfada mouse imlecinin el ÅŸeklinde gözükmesi için <body> tagını aÅŸağıdaki gibi yazmanız gerekiyor.

<body style="cursor:hand;">

CSS cursor özelliğinin alabileceği değerler aşağıdaki gibidir:

url
Bu değer ile kendi tasarladığımız .cur uzantılı imleci tanımlayabiliyoruz.
Kullanım ÅŸekli <img style=”cursor:url(’sat.cur’);” />
Bu yazının devamını okuyun »

CSS ile açıklamalı menü

Bu dersimizde CSS ile açıklamalı bir menü yapmayı öğreneceğiz.

http://img.sanalkurs.net/uploads/buttonahover2.gif

http://img.sanalkurs.net/uploads/buttona2.gif

Html Kodu:

<div id="menu">
  <ul>
    <li><a href="#">Anasayfa<span>Sitenin Bütün İçerik Linkleri Bu sayfada</span></a></li>
    <li><a href="#">Sanalkurs Forum<span>Forum Bölümümüzden Bilgi Paylaşım Yapabilirsiniz</span></a></li>
    <li><a href="#">Müzik<span>Müzik Bölümümüz Her Türlü Full Albüm</span></a></li>
    <li><a href="#">Video<span>Video İçeriği</span></a></li>
  </ul></div>

Bu yazının devamını okuyun »

Şeffaf Tasarımlar

XHTML sayfalarda gördüğünüz şeffaf tasarımlar CSS ile nasıl yapılır?

http://img.sanalkurs.net/uploads/seffafMenu.jpg

Temelde bu örnek, bir tablonun arkaplanında yer alan bir görsel ve o tablonun hücrelerinin opaklık değerinin düşürülmesiyle oluşmuştur. Dolayısıyla örneğimizin ilk adımı tablo oluşturmak olmalıdır.

Yeni bir HTML dokümanı oluÅŸturarak içerisine 4 sütun, 1 satırdan oluÅŸan bir tablo ekleyin. Tablonun geniÅŸlik ve yükseklik deÄŸerlerini kullanacağınız arkaplan resmine göre ayarlayın ve her bir hücreye gelmesi gereken menü yazılarınızı yazın. Son olarak tablonun kullanacağı class deÄŸerini seffafTable olarak ayarlayın. Bu yazının devamını okuyun »

CSS Hakkında Temel Bilgiler

CSS Nedir?

HTML bize metin biçimlendirme alanında çok geniş olanaklar sunar. CSS, uzun yazılışıyla Cascading Style Sheets, veya Türkçesiyle Stil şablonları ise bunu bir adım daha öteye götürür, bize sayfalarımız için global şablonlar hazırlama olanağı verdiği gibi, tek bir harfin stilini; yani renk, font, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki bu esnekliğidir.

Bir web sayfası içerisinde zaten estetik kuralları gereği yüzlerce renk ve font kullanmayız. Genelde birbiriyle uyumlu birkaç renk ve birkaç font kullanırız ki, bunları her sayfada ayrı ayrı tekrar belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün web sayfamızda kullanabiliriz.Bu şekilde güncelleme yaparken de onlarca sayfayı değiştirmekten kurtuluruz.

CSS kodları HTML kodlarının içine yazılırlar. Türüne göre body veya head bölümlerinde yer alabilirler. Bunların dışında harici CSS dosyaları oluşturulup bunlar gerektiğinde HTML belgesi içerisinde çağırılabilirler.

Hemen hemen her konuda olduÄŸu gibi CSS konusunda da Microsoft Internet Explorer ve Firefox farklı yorumlar ortaya koyarlar. Bu noktada her iki browser’ın da aynı/benzer yorumlayacağı kodlar yazmak en uygunudur. Bu yazının devamını okuyun »

Internet Explorer’da CSS Sorunları

Diyelim ki sayfanıza resim eklediniz ve link verdiniz. Bu resmi buton ÅŸeklinde yaptınız. Üstüne geldiÄŸinizde de etrafında bordür oluÅŸmasını istiyorsunuz. Normal ÅŸartlar altında CSS’ de sadece a:hover kullanarak bunu pratik biçimde yapabiliyoruz. Ancak Microsoft’un tutarsızlığı sebebiyle IE bazı CSS komutlarını tanımıyor. Bizde buna alternatif bir çözüm üretiyoruz. 

AÅŸağıdaki örnek kodlama Firefox ve IE7′ de çalışıyor. Altındaki koÅŸul ile eÄŸer browser IE6 ise … kodları oku diyerek CSS kodlarını IE6′ya göre yapmış oluyoruz. Bu yazının devamını okuyun »

        Hosting Hizmetlerimiz