Merhaba dostlarım bugün sizlerle CSS ile 3. dersimize devam ediyoruz.
Arkadaşlar az şey öğretiyorsun falan diyen olursa şöyle diyeyim , detaylı ve olduğunca açıklamaya çalışıyorum. Bu yüzden kısa ve öz oluyor.
Şimdi hemen başlayalım gene CSS ve HTML ikilisini kullanıcaz.(Tüm kodlara en altta ulaşabilirsiniz)
Bu dersimizde bu kadardı ileriki derslerimi takip ederek CSS'in temelini öğrenerek tamamlayabilirsiniz.
HTML KOD:
CSS KOD:
Arkadaşlar az şey öğretiyorsun falan diyen olursa şöyle diyeyim , detaylı ve olduğunca açıklamaya çalışıyorum. Bu yüzden kısa ve öz oluyor.
Şimdi hemen başlayalım gene CSS ve HTML ikilisini kullanıcaz.(Tüm kodlara en altta ulaşabilirsiniz)
Kod:
.deneme button{
font-size:20px; (Arkadaşlar burada font-size yazmakta bu yazımızın ve butonun boyutunu ayarlamakta)
border-radius: 7px; (border-radius(radius anlamı: yarıçap border: kenar) butonun kenarlarında ki yarı çapı ayarlıyor kısacası yuvarlak yapıyor)
margin-left:70px;(margin-left ,top , right ne işe yaradığını bilmeyen css 1 ve 2 eğitimlerine bakabilir)
margin-top:50px;
box-shadow: 3px 3px 3px red; (box-shadow butonumuza containerlarımıza vs. gölge verir ben burada 3px verdim belirgin olsun diye
}Bu dersimizde bu kadardı ileriki derslerimi takip ederek CSS'in temelini öğrenerek tamamlayabilirsiniz.
HTML KOD:
Kod:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="deneme.css">
<**** charset="UTF-8">
<title>HackPandaEğitim</title>
</head>
<body>
<div class="deneme">
<button>Shadow</button>
</div>
</body>
</html>CSS KOD:
Kod:
*{
margin:0px;
padding:0px;
}
body{
background-color:lightgray;
}
.deneme{
color:white;
}
.deneme button{
font-size:20px;
border-radius: 7px;
margin-left:70px;
margin-top:50px;
box-shadow: 3px 3px 3px red;
}CSS EĞİTİM #1 : https://www.turkhackteam.org/web-programlama/1944066-css-egitim-1-a.html
CSS EĞİTİM #2 : https://www.turkhackteam.org/web-programlama/1944077-css-egitim-2-a.html
Son düzenleme:
