جميع أكواد HTML و CSS
مقدمة عن HTML و CSS
تعد HTML (لغة ترميز النصوص التشعبية) و CSS (أوراق الأنماط المتسقة) من الأسس الأساسية لتطوير المواقع الإلكترونية. توفر هذه اللغتان الهيكل والمظهر الجمالي لأي موقع على الويب. في هذا المقال، سنستعرض جميع الأكواد المهمة التي يجب على كل مطور ويب معرفتها.
كود HTML الأساسي
تبدأ أي صفحة ويب بكود HTML. إليك الكود الأساسي:
<!DOCTYPE html>
<html>
<head>
<title>عنوان الصفحة</title>
</head>
<body>
<h1>مرحبا بكم في موقعي</h1>
<p>هذه فقرة توضيحية</p>
</body>
</html>
أكواد العناصر الأساسية في HTML
من بين العناصر الأساسية التي يجب معرفتها:
- <h1> – <h6>: لتحديد العناوين
- <p>: لتحديد الفقرات
- <a>: لإنشاء الروابط
- <img>: لإضافة الصور
- <ul> و <ol>: لإنشاء القوائم
كود CSS الأساسي
تستخدم CSS لتنسيق مظهر الصفحة. إليك مثالاً بسيطاً على كود CSS:
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: blue;
}
أكواد CSS الشائعة
بعض الأكواد الشائعة التي يمكنك استخدامها لتنسيق الصفحات:
- color: لتحديد لون النصوص
- background-color: لتغيير لون الخلفية
- font-size: لتحديد حجم الخط
- margin: لتحديد المسافات حول العناصر
- padding: لتحديد التباعد داخل العناصر
دمج HTML و CSS
يمكن دمج HTML و CSS بطرق مختلفة. واحدة من الطرق الأكثر شيوعاً هي استخدام علامة <style> داخل قسم <head> من مستند HTML، على سبيل المثال:
<head>
<style>
body { background-color: #fff; }
</style>
</head>
استخدام CSS خارجي
يمكنك أيضاً استخدام ملف CSS خارجي عن طريق ربطه بملف HTML الخاص بك كالتالي:
<link rel="stylesheet" type="text/css" href="styles.css">
استنتاج
في هذا المقال، قمنا بتغطية جميع الأكواد الأساسية لـ HTML و CSS. يعتبر فهم هذه الأكواد ضرورياً لأي مطور ويب. إن mastery لهذه التقنيات سيمكنك من إنشاء مواقع إلكترونية جذابة وعملية.