الدرس 7: مقدمة في CSS

🔗 فهرس دورة HTML:

📘 مقدمة إلى CSS

🔹 1. ما هي CSS؟

CSS (Cascading Style Sheets) هي لغة تُستخدم لتنسيق وتصميم صفحات الويب. تتحكم في ألوان النصوص، الخطوط، الخلفيات، التباعد، والمظهر العام.

🔹 2. كيف نربط CSS بصفحة HTML؟

يمكننا ربط CSS بعدة طرق:

داخل ملف HTML مباشرة (داخل <style>):

<style>
  body { background-color: #f0f0f0; }
  h1 { color: blue; }
</style>

ملف CSS خارجي مرتبط:

<link rel="stylesheet" href="style.css">

🔹 3. مثال بسيط على تنسيق النص

h1 {
  color: red;
  font-size: 36px;
  text-align: center;
}
p {
  color: #333;
  font-family: Arial, sans-serif;
}

🔹 4. مثال كامل داخل صفحة HTML

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>صفحة مع CSS</title>
    <style>
      body {
        background-color: #f9f9f9;
      }
      h1 {
        color: green;
        text-align: center;
      }
      p {
        font-size: 18px;
        color: #555;
      }
    </style>
  </head>
  <body>
    <h1>مرحبًا بكم!</h1>
    <p>هذه صفحة مصممة باستخدام CSS داخلية.</p>
  </body>
</html>

---

المقال السابق: النماذج (Forms)

البداية من جديد: مقدمة إلى HTML

مدونة عادل للتقنية