Arkadaşlar hepinize tekrardan merhaba , zamanım oldukça dersleri hızlıca yayınlamaya çalışıyorum.
Umarım işinize yarıyordur
Bugün HTML ve CSS ikilisi ile çalışacağız , nedeni ise yaptığımız işi somut bir şekilde görmek.
Öncelikle CSS sayfamızı HTML sayfamıza bağlamamız gerek bunun için yazmamız gereken kod
Umarım işinize yarıyordur
Bugün HTML ve CSS ikilisi ile çalışacağız , nedeni ise yaptığımız işi somut bir şekilde görmek.
Öncelikle CSS sayfamızı HTML sayfamıza bağlamamız gerek bunun için yazmamız gereken kod
Kod:
[CENTER][COLOR="White"]<link rel="stylesheet" href="deneme.css"> (Bu kod html sayfasında <head></head> etiketleri arasına yazılmalıdır.)[/COLOR][/CENTER]
Kod:
Bu dersimizde bazı yeni terimler görücez onlar ise şöyle :
width(genişlik verir) ve height(yükseklik verir)
width:100px;
height:50px;
px(pixel) olarak tanımlanır.
Kod:
border: solid 1px black; (yaptığınız tabloda veya oluşturduğunuz containerların kenarlarına kalınlık verir.) Kenarlık(border)
Solid özelliği katılık verir. Renk tanımlanabilir ve pixel yani kalınlığın boyutunuda arttırabilirsiniz.Devam edelim malum CSS karışık ve çok fazla terimin olduğu bir dil. Bazıları için basit gelsede emin olun değil.
Kod:
margin-left:500px; (sayfanın sol kısmından boşluk bırakır)
margin-top:50px; (sayfanın üstünden boşluk bırakır)Bu dersimizde bu kadardı alt tarafda tüm kodların birlikte olduğu haline ulaşabilirsiniz
HTML KODLARI:
Kod:
[COLOR="Red"]<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="deneme.css">
<**** charset="UTF-8">
<**** name="viewport" content="width=device-width, initial-scale=1.0">
<title>HackPandaEğitim</title>
</head>
<body>
<p>Eğitim serisi</p>
<!--Arkadaşlar CSS de öğreneceğimiz şeyler sadece web alanında ve diğer dillerde işimize yarayacak kadar olanıdır fazlası kafa karışıklığan sebeb olabilir.-->
<div class="border">
Bu bir deneme yazısıdır
</div>
</body>
</html>[/COLOR]CSS KODLARI:
Kod:
*{
margin:0px;
padding:0px;
width:100%;
}
body{
background-color:lightgray;
}
p{
color:red;
background-color:black;
}
.border{
width:100px;
height:50px;
border: solid 1px black;
margin-left:500px;
margin-top:50px;
}
Son düzenleme:
