|
| CSS |
CSS(Cascade Style Sheet)
Css'nin en önemli yararı yaptığınız değişiklikleri diğer başka elemenlar için uygulayabilmemizdir.Örneğin bir yazıyı kırmızı ve 10 pt büyüklüğünde yaptık. Eğer başka bir yazıyıda aynı şeyi yapmak istiyorsak stil kullanmamız işi kolaylaştırır. Bir nesne üzerinde yaptığımız her türlü değişikliğin toplamına stil denir. Stillerin bazı yararları aşağıda listelenmiştir.
- Bir stil bir çok elamana uygulanabilir.
- Aynı elemana farklı stiller verilebilir.
- Bir stil değiştirildiğinde ondan etkilenen elemanlarda değişir.
- Aynı stil farklı sayfalarda kullanılabilir.
- Stiller arasında ilişki kurarak birbirlerine göre hareket etmesini sağlayabiliriz(Örneğin paragrafımız ciddi yazı stiliyse linkinizi mavi eğlenceli yazı stiliye linkimizin kırmızı olmasını sağlayabiliriz)
css kullnaımı
< html >
< head >
< style >
Stiller buraya
< /style >
< /head >
< body >
Sayfa burada
< /body >
< /html >
Duyarlı Link Yapımı
Bir yazının üzerine fare ile gittiğimizde bazı özelliklerin değişmesi için kullanılır. Örneğin bir linkin rengini değiştirebiliriz. Aşağıdaki örnekte mavi olan link üzerine gelindiğinde linkin rengini kırmızı yapıyoruz.Ziyaret edilen linkin rengini koyumavi yapıyoruz.
a:link normal link rengi,
a:hover fare ile gelindiğinde olacak olan renk,
a:visited bir link ziyaret edilince değişen renk,
a:focus bir eleman aktif olduğunda bazı özellikleri değiştirmek için kullanılır.
< html >
< head >
< style >
a : link {color:blue;}
a : hover {color:red;}
a : visited {color:darkblue;}
< style >
< body >
< a href="">üzerine fare ile gelindiğinde kırmızı olur.< /a >
< /body >
< /html >
|
Başa Dön
| BASİT RESİM GALERİSİ |
< img src="14.gif" width=70 height=70 onmouseover="ust.src='14.gif'" onmouseout="ust.src='team.jpg'" >
Yukarıdaki kodda "width" resmin genişliğini, "height" ise resmin yüksekliğini ayarlamak için kullanılır.
"onmouseover" resmin üzerine mouse ile geldiğimizdi "ust" ismini verdiğimiz yerde görünmesini sağlar.
"onmouseout" resmin üstünden mouse çekildiğinde ise "ust" ismini verdiğimiz yerde başka bir resmin görünmesini sağlar.
ÖRNEK:
|
Başa Dön
| POPUP PENCERE |
window.open
window.open() metodu yeni pencere açmak için kullanacağımız metoddur. Bu metodun bir çok parametresi vardır.
window.open("yenipencere.html"); yeni bir pencere açar ve içinde yenipencere.html adlı web sayfasını görüntüler. Bunu bir fonksiyon olarak tanımlayabilir ve fonksiyonu çağırtarak yeni pencere açtırabiliriz ya da bir buton tanımlar ve buton üzerinden direkt olarakta pencereyi açtırabiliriz.
Yeni pencere açarken kullanacağımız parametreler şunlardır:
width : Pencerenin genişliği (Pixel olarak)
height : Pencerenin yüksekliği (Pixel olarak)
toolbar : Toolbar çubuğunun gösterilmesi(yes/no)
menubar : Menü çubuğunun gösterilmesi(yes/no)
scrollbars : Kaydırma çubuklarının gösterilmesi(yes/no)
location : Url çubuğunun gösterilmesi(yes/no)
status : Sttus çubuğunun gösterilmesi(yes/no)
directories : İkinci araç çubuğunun gösterilmesi(yes/no)
resizable : Pencerenin büyütülüp küçültülmesi(yes/no)
top : Üst kenara uzaklık(pixel olarak)
left : Sol kenara uzaklık(pixel olarak)
ÖRNEK: Aşağıdaki resime tıklayınız...
KODU:
< html >
< head>
< script >
function ac( )
{ window.open("pen.html","pen","top=200 left=300 width=400 height=200"); }
< /script >
< /head >
< /html >
|
Başa Dön
|
|
