Selamlar Dostlar.
Yaklaşık bir süredir yazılım öğrenmeye başladım.
Öncelikle
HTML ve CSS yapılarını öğrendim, derslerim bitti sayılır ve çoğu konuya hâkimim diyebilirim.
Ufak ufak kendi projelerimi oluşturmaya başladım, şu anda HTML ve CSS konusunda kendime güveniyorum.
Etiketleme düzenine, dosya yapısına ve sade tasarımlara dikkat etmeye çalışıyorum.
Bundan sonraki hedefim
JavaScript,
Bootstrap ve
jQuery konularına geçmek olacak.
Ancak öncesinde sizden birkaç tavsiye almak istiyorum:
- HTML & CSS alanında kendimi daha fazla nasıl geliştirebilirim?
-Gerçek dünya projelerine hazırlanmak için nasıl bir yol izlemeliyim?
- Tavsiye edebileceğiniz kaynak, proje fikri veya pratik yöntemi var mı?
Aşağıda örnek olarak hazırladığım ufak bir
HTML & CSS çalışmamı paylaşıyorum.
Ufak ufak başlıyorum. Hatalarım olabilir, yorum ve önerilerinizi bekliyorum 😊
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Padding ve Margin Görsel Örnek</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #0f172a;
color: #e2e8f0;
text-align: center;
padding: 40px;
}
h1 {
color: #38bdf8;
}
.kapsayici {
background-color: #1e293b;
padding: 30px;
border-radius: 10px;
display: inline-block;
}
.kutu {
background-color: #38bdf8;
color: #0f172a;
border: 4px solid #0ea5e9;
padding: 30px;
margin: 40px;
border-radius: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.3);
}
.etiket {
margin-top: 20px;
background: #1e293b;
padding: 10px 15px;
border-radius: 8px;
display: inline-block;
font-size: 15px;
}
.aciklama {
max-width: 600px;
margin: 30px auto;
color: #94a3b8;
line-height: 1.6;
}
</style>
</head>
<body>
<h1>CSS Box Model: Padding ve Margin</h1>
<div class="kapsayici" style="border:2px dashed #64748b;">
<div class="kutu">
<strong>Ben bir kutuyum </strong><br>
(padding = 30px, margin = 40px)
</div>
</div>
<p class="etiket">Gri alan: margin (dış boşluk)</p><br>
<p class="etiket" style="background:#38bdf8; color:#0f172a;">Mavi alan: padding (iç boşluk)</p>
</body>
</html>
Görüşlerinizi, önerilerinizi ve tavsiyelerinizi paylaşırsanız çok mutlu olurum.
Şimdiden teşekkür ederim
