Bazı basit ama işe yarar css kodları
1. Sabit arkaplan kodu:
background: url(bg.jpg) no-repeat 100%;
background-attachment: fixed;
2. Css dosyasını siteye gömme:
<link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
3. Sitenizin yazı tipini belirleme kodu:
font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
4. Linkteki altçizgiyi kaldırma kodu:
text-decoration: none;
5. Üzerine gelince renk değiştirme kodu:
.auto-style1:hover {
color:aqua;
}
6. Yazı altına çizgi ekleme:
border-bottom:solid 3px red;
7. Link, Paragraflara özellik renk tanımlaması yapılabilir:
a {
color: white;
text-decoration: none;
}
a:hover {
color:aqua;
text-decoration: line-through;
}
p:hover {
color:aqua;
}
8. Arkaplan sabit resim yapma kodu:
background: url(images/bg.jpg) no-repeat 100%;
background-attachment: fixed;
9. Css ile yuvarlak:
background-color: #6286a0;
width: 200px;
height: 200px;
border-radius: 200px;
border: 15px solid rgba(255, 255, 255, .5);
10. Resme opaklık saydamlık verme kodu:
opacity: 0.5;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
11. Yukarıda sabit duran cisim yapma:
position: fixed;
z-index:100;
12. altta sabit duran menü:
position:fixed;
bottom:0px;
13. calc() metodu kullanımı:
örneğin left:calc(50% - 100px); dediğimiz zaman sayfanın tam ortasını alır 100 px çıkartır
14.
background: url(bg.jpg) no-repeat 100%;
background-attachment: fixed;
2. Css dosyasını siteye gömme:
<link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
3. Sitenizin yazı tipini belirleme kodu:
font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
4. Linkteki altçizgiyi kaldırma kodu:
text-decoration: none;
5. Üzerine gelince renk değiştirme kodu:
.auto-style1:hover {
color:aqua;
}
6. Yazı altına çizgi ekleme:
border-bottom:solid 3px red;
7. Link, Paragraflara özellik renk tanımlaması yapılabilir:
a {
color: white;
text-decoration: none;
}
a:hover {
color:aqua;
text-decoration: line-through;
}
p:hover {
color:aqua;
}
8. Arkaplan sabit resim yapma kodu:
background: url(images/bg.jpg) no-repeat 100%;
background-attachment: fixed;
9. Css ile yuvarlak:
background-color: #6286a0;
width: 200px;
height: 200px;
border-radius: 200px;
border: 15px solid rgba(255, 255, 255, .5);
10. Resme opaklık saydamlık verme kodu:
opacity: 0.5;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
11. Yukarıda sabit duran cisim yapma:
position: fixed;
z-index:100;
12. altta sabit duran menü:
position:fixed;
bottom:0px;
13. calc() metodu kullanımı:
örneğin left:calc(50% - 100px); dediğimiz zaman sayfanın tam ortasını alır 100 px çıkartır
14.
Yorumlar
Yorum Gönder