ربط اكواد الـ CSS مع اكواد HTML الدرس|2| - Programmer Tech

Programmer Tech

موقع تعليم مجاني يهتم بتعلم البرمجة و علوم الكمبيوتر, أمن المعلومات, القرصنة الأخلاقية, سكربتات

إعلان اعلى المقالة

الثلاثاء، 10 ديسمبر 2019

ربط اكواد الـ CSS مع اكواد HTML الدرس|2|


ربط اكواد الـ CSS مع HTML

اليوم سوف نتعرف على كيفية ربط ملف الـ css مع html, توجد هناك طريقتين لربط css مع html وهي :

الربط الداخلي

يكون هذا عن طريق الوسم المستخدم في التنسيق و هو style و يكون موقعه في الصفحة بين الوسم head و body و الصورة الآتية توضح لنا الطريقة و موقع الوسم.






او ادراج هذا الوسم بين وسم body كما بالمثال بالصورة التالية



الربط الخارجي

هي الطريقة الشائعة و المستخدمة بكثرة, لأنها تكون افضل في التعامل مع الأكواد و تكون اكواد css لوحدها خارج ملف الـ html وتستطيع التحكم بها في حال وجود أي اخطاء.

نقوم بإنشاء مجلد جديد على سطح المكتب نسميه بإسم مشروعنا و بداخل هذا المجلد ننشئ ملف بإسم index.htm ونكتب به اكواد الـ html, ثم ننشئ ملف ثاني و نسميه بإسم style.css ونكتب به اكواد الـ CSS كما بالصورة التالية


والآن نأتي لربط التنسيق مع الهيكلة كما توضح الصورة التالية



عن طريق الوسم link وهو وسم احضار الروابط من الخارج وعن طريق خاصية href قمنا بإحضار مسار ملف css.

سوف نقوم الآن بتجريب الربط هل نجح ام يوجد خلل معنا, سأقوم بإعطاء اللون الأحمر لكامل الصفحة عن طريق الـ CSS الصورة التالية توضح لنا اول كود في CSS.




و سوف نحصل على النتيجة التالية تؤكد لنا نجاح طريقة الربط و اعطى الخلفية الحمراء للصفحة بالكامل

ليست هناك تعليقات:

إرسال تعليق

facebook

تسميات

تواصل معنا

Translate

أخر الافكار

من انا

authorمبرمجين ويب و محبين للتقنية و الشبكات و امن المعلومات و سوف نقدم لكم الافضل إن شاء الله
أعرف المزيد ←

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

اقسام