منتديات نور الاستقامة - عرض مشاركة واحدة - كيفية عمل استايل لصفحتك بواسطة Css
عرض مشاركة واحدة
Icon26  كيفية عمل استايل لصفحتك بواسطة Css
كُتبَ بتاريخ: [ 03-03-2011 ]
رقم المشاركة : ( 1 )
الصورة الرمزية عابر الفيافي
 
عابر الفيافي غير متواجد حالياً
 
رقم العضوية : 1
تاريخ التسجيل : Jan 2010
مكان الإقامة : في قلوب الناس
عدد المشاركات : 8,917
عدد النقاط : 363
قوة التقييم : عابر الفيافي قمة التميز عابر الفيافي قمة التميز عابر الفيافي قمة التميز عابر الفيافي قمة التميز


كيفية عمل استايل لصفحتك بواسطة Css

بسم الله الرحمن الرحيم

مواضيع سابقة



[ الدرس الأول ] كيفية عمل استايل لصفحتك بواسطة Css

صفحتنا العادية بلغة Html تكون غالبا بهذا الشكل

كود بلغة HTML:
<Html> <Head>رأس الصفحة</Head> <Body> محتوى الموضوع نادى دروسكم </Body> </Html>


هذا المحتوى العادى للصفحة باستخدام لغة Html

طبعا فوائد استخدام لغة Css كما تكلمنا عنها فى المقدمة هى توفير استايل يتحكم فى صفحات موقعك

و التصميم كاملا

الآن سوف نرى الصفحة و لكن بلغة Css

كود بلغة HTML:
<Html> <Head> <style type="text/css"> P { color:blue; text-align:right; } </style> </Head> <Body> <P> اهلا بكم فى نادى دروسكم </P> <P> زورونا على الرابط التالى Www.Drooscom.Com </P> </Body> </Html>


سوف تظهر لنا الصفحة بهذا الشكل شوف المثال

Css.Lesson.1.Ex.1.html

سوف نشرح الآن فائدة كل كود و كيف نتحكم بالاستايل اولا

كود بلغة HTML:
<style type="text/css">


هذا يوصف نوع الاستايل المستخدم و هو استايل Css

يجب وضع الكود التالى فى وسم الهيدر

<Head>هنا</Head>

ثم

P

هو الوسم الذى سنستخدمه لتنسيق التصميم

مثلا اى شىء نريده ان يكون بنفس تنسيق الاستايل نستخدم الوسم

<P>هنا محتوى الكلمات</P>

كود بلغة HTML:
{ color:blue; text-align:right; }


تابع الأقواس الاستايل يجب ان يكون داخل هذه الأقواس

{ هنا }

نأتى للاوامر

كود بلغة HTML:
color:blue;


معناها ان اللون سوف يكون أزرق

ثم اذا اردت وضع امر آخر بعد هذا تقوم بوضع مسافة و تكتب الامر الثانى

كود بلغة HTML:
text-align:right;


و معناها محاذاه النص سوف تكون الى اليمين تابع المثال السابق

ليصبح الكود بهذا الشكل

كود بلغة HTML:
{ color:blue; text-align:right; }


طبعا يمكن كتابة الكثير من الاوامر داخل الاستايل

هنا ميزة Css

اننى يمكننى تغيير الاستايل نفسه بدون التعديل على صفحة Html

كالتالى

يمكننى مثلا تغيير اللون و المحاذاة من الاستايل نفسه

P { color:red; text-align:center; }

هنا اخترت اللون ليكون احمر و المحاذاة وسط

تابع المثال لترى كيف تغيرت الصفحة

Css.Lesson.1.Ex.2.html

الآن عرفنا مكان وضع كود الاستايل و عرفنا بعض المعلومات عن الاكواد و Css

لاحقا ان شاء الله سوف نتناول كيفية عمل استايل فى ملف مستقل بعيدا عن الصفحة

و الكثير و المزيد من الاوامر

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

;dtdm ulg hsjhdg gwtpj; f,hs'm Css hsjhdg css f,hs'm ulg





توقيع :



لا يـورث الـعلم مـن الأعمام **** ولا يـرى بالليـل فـي الـمنـام
لـكــنـه يحصـــل بالتـــكـــرار **** والـدرس بالليـــل وبـالـنـهار
مـثاله كشجرة فـــي النــفس **** وسقيه بالدرس بعد الـغرس

رد مع اقتباس