ĞĽāĎĭĀŦǿŘ مصمم المنتدى
حالة المزاج : الـجـــنـــســـ : عدد المساهمات : 1030
الاوسمة :
| موضوع: افتراضي الدرس الثاني : كيفية كتابة أكواد الـ css الجمعة سبتمبر 02, 2011 3:27 pm | |
|
الســلام علــيكم ورحمــة اللــهـ وبركــاتهـ .. والصــلاة والسـلام على أفضـل خلـق اللــهـ أجمــعين ..
صبــاحكمـ | مســائكـمـ معــطر بـذكـر الرحمـن ..
[size=21]أهــداف الدرس:
التعـرف على طريقة وأنواع كتابة الأكواد في صفحات المواقع..
نبــدأ باســم اللــهـ ..
يوجد لدينا ثلاثة طرق لكتابة الأكواد الخاصة بالـ CSS سنتطرق لكل واحدة ونتعرف عليها أكثر .. لك حرية الاختيار في استخدامك لأي طريقة منهم ..
ولكن مبدأيا سنتعرف عليهم ومن ثما سنأخذ أمثلة في الدروس القادمة بعون الرحمن
الطريقة الأولى:
Inline Style وضع الأكواد ضمن وسوم الهتمل |HTML Tags بمعنى ان تضعها في نفس سطر الكود باستخدام خاصية الـ Style
مثال:
نريد ان نجعل لون خلفية الصفحة باللون الأسود يمكنك استخدام الـ Inline كالتالي:
كود PHP:
<body style="background-color:black;">body>
الوسم body هو المسؤول عن صفحة الهتمل ككل
الطريقة الثانية:
Internal Style
ستايل داخلي
وهو تضمين أكواد الاستايل داخل الصفحة وليس في نفس السطر مثل الـ Inline
سنستخدم الوسم
مثال:
سنأخذ نفس المثال السابق ..
لو أردنا جعل خلفية الصفحة بلون أسود ..
بأستخدام الـ Internal ستكون الخطوات كالتالي:
1/ يجب كتابة االوسم
كود PHP:
في أول الصفحة (تحت وسم العنوان مباشرة).
[center]سنقوم بكتابة كود الخلفية التي نريدها كالتالي:
كود PHP:
body { background-color:black; }
يجب اغلاق وسم STYLE الذي اضفناه بالأول
كود PHP:
[center]الطريقة الثالثة:
External Style
ستايل خارجي
وهو عمل صفحة خاردجية يكون امتدادها
.css
تحمل كل الأوسمة والأكواد المتحكمة في الموقع ككل..
ويتم رفع الملف الى ملفات الموقع ..
مثال:
عند استخدامنا الاكسبريشن ويب مثلا..
من قائمة
File ->New->CSS
ستظهر لك صفحة
فقط اكتب فيها الأكواد بدون بداية او اغلاق ..
يعني مثلا نريد الخلفية سوداء - ولون خط الصفحة كلها نريدها بالأبيض - وحجمه كبير
سنكتب :
كود PHP:
body { background-color:black; color:white; font-size:x-large; }
[center]أتمنى تكونو فهمت الدرس واستوعبتو مني شوية ..
شاكر لكم متابعتكم ..
الــى اللــقاء في درس جديد ^_^ [/center] [/center] [/center] [/size]</font></font></font></strong></div> | |
|