تعلّم معي (1) CSS

 

 

ماذا نقصد بـ Css ؟

 

هي اختصار لـ Cascading Style Sheets

 

وهي تعني : صفحات الأنماط المتعاقبة

 

ونستطيع بأستخدام هذه التقنيه فصل تنسيق الصفحة عن محتواها

 

اي نقوم بأرفاق جمل الـ CSS لنستطيع عرض عناصر الـ html بالتنسيق الذي نريد

 

قبل البدء يجب انت تعلم على الأقل القواعد الأساسية لأستخدام الـ html\xhtml

 

الأنماط ساعدت في حل المشاكل المشتركه :

اوسمه الـ html تستخدم عادة لتعريف محتويات الصفحة ، اي انه عندما نريد ان نقول “This is a header”, “This is a paragraph”, “This is a table”

نستخدم الاوسمه مثل:<h1>, <p>, <table>

لذا فإن تخطيط الصفحة احتمال ان يتغير بتغير المتصفح.

ولقد قامت المتصفحات الرئيسية أمثال: Netscape – Internet Explorer بأضافة العديد من الأوسمه والخواص للـ html الأصلية لذا صار من الصعب جداً انشاء صفحات متوافقه في التخطيط في جميع المتصفحات .

 

لحل هذه المشكلة قام اتحاد نظام الشبكة الآلية the World Wide Web Consortium بتوحيد قياسي يعمل على جميع المتصفحات ويرفق بالـ html

 

صفحات الأنماط تستطيع حفظ الكثير من العمل:

 

صفحات الانماط المتعاقبة تقوم بتوضيح كيفية عرض عناصر الـ html , مثل اوسمه الخط وخواص الألوان … الخ

عن طريق صفحة نمط واحده تستطيع تنسيق وتخطيط كيفية عرض الصفحات الموجوده في موقعك بأكمله !

 

الـ CSS تقنيه عظيمة في تصميم المواقع لأنها تسمح للمطورين بالتحكم في تخطيط صفحات الانترنت , وأنت كمطور للموقع تستطيع تغير تنسيق كل عناصر الصفحه او بعضها لتحدث تغير عام في الموقع كما تريد.

 

أي نمط نستخدم عندما يكون هناك اكثر من نمط محدد من عناصر الـhtml؟

 

بشكل عام نستطيع القول بأن كل الأنماط “تختفي” وتصبح في نمط “افتراضي” جديد بالقواعد التالية .. نبدأ بالأولوية الأعلى :

 

  1. النمط الموجود في عناصر الـ html.
  2. نمط صفحة الأنترنت ( داخل وسم الرأس <head>).
  3. صفحة الأنماط الخارجية.
  4. المتصفح الأفتراضي.

أذن ، اذا وجد الأولوية الاعلى يتم التجاوز عن التنسيقات ذات الأولوية الأقل.

 

هناك طرقتين لأستخدام جمل الـ CSS :

 

  • داخلي

نقوم بوضع الجمل في الأعلى في نفس الملف الذي يحوي جمل html.

  • خارجي

نقوم بوضع ملف آخر يحوي جمل الـ CSS فقط ويكون امتداده css.

 

 

ايهم أفضل ؟

 

يفضل استخدام التنسيق الخارجي لأننا بهذا نستطيع عمل التنسيق على اكثر من صفحه وربما على الموقع بأكمله .

 

 

اتمنى انكم استفدتوا من الدرس الأول

اذا وجد خطأ مني الرجاء ابلاغي في الحال

 

 

 

Advertisements

رد واحد

اترك رد

إملأ الحقول أدناه بالمعلومات المناسبة أو إضغط على إحدى الأيقونات لتسجيل الدخول:

شعار وردبرس.كوم

أنت تعلق بإستخدام حساب WordPress.com. تسجيل خروج   /  تغيير )

Google+ photo

أنت تعلق بإستخدام حساب Google+. تسجيل خروج   /  تغيير )

صورة تويتر

أنت تعلق بإستخدام حساب Twitter. تسجيل خروج   /  تغيير )

Facebook photo

أنت تعلق بإستخدام حساب Facebook. تسجيل خروج   /  تغيير )

Connecting to %s

%d مدونون معجبون بهذه: