 |  |
| | |
سنبدأ بتوضيح أولى القواعد الأساسية في كتابة وتعريف الأكواد التى تعتمد عليها هذه التقنيه ونبدأ
مع مثال بسيط جدا لصفحه ويب كما نشاهدها هنا:
صفحه عادية بلغه xhtml كما يتضح من أول سطر في الوسم <!DOCTYPE> وبعنوان "css الأنماطكود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS الأنماط الإنسابية</title>
</head>
<body>
<p>قواعد أساسية في تعريف وكتابة الأوامر</p>
</body>
</html>
الإنسابية" وتحتوى على فقرة وحيدة بداخل الوسم <body> , عدلنا أيضاً إتجاه الصفحة من اليمين
الى اليسار حتى تناسب طبيعة صفحات مواقعنا العربية.
لو شاهدتها على المتصفح تظهر لك بالشكل التالي
تعال وشاهد نفس الصفحة ولكن مضاف اليها تعريف للفقرة حتى يتم تلوين الخط بداخلها ، وشاهد
معى الصفحه والكود مرة أخرى
كود PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS الأنماط الإنسابية</title>
<style type="text/css">
<!--
p { color:red; }
-->
</style>
</head>
<body>
<p>قواعد أساسية في تعريف وكتابة الأوامر</p>
</body>
</html>
تم تلوينها باللون الأحمر ـ والحال نفسه سيكون مع كل فقرات الصفحة الأخرى حيث سيتم تطبيق
هذا الأمر عليهم جميعاً
أول قاعدة في كتابة الأوامر
Selector : المكان الذى تريد تطبيق الخصائص عليه ، ويمكن ان تختار
اى من وسوم html مثل الروابط <a> والفقرات <p> والجدوال
<table> , <td> , <tr> وجسم الصفحه <body>وغيرها.
Property : الخصائص التى سوف تتحكم من خلالها في الوسوم
المختلفة وهى تنتهي بنقطتين [ : ].
Value : القيم المختلفة لكل خاصية فلكل خاصية مجموعة قيم
تحددها وهى تنتهي بفاصلة منقوطة [ ; ].
Declaration block : المكان المحتوي على كل من الخواص والقيم
ومن خلاله يتم التصريح ببدء العمل أو الفعالية ويبدأ وينتهي بأقواس
معقوفة [ { } ].
طريقة كتابة الامر نفسها لا تفرق إن كتبت بهذا الشكل
أو هذا الشكلكود PHP:p { color:red; background-color: #333; }
او كانت كذلككود PHP:p {
color:red;
background-color: #333;
}
كود PHP:p
{
color:red;
background-color: #333;
}
ولكن لمزيد من التنسيق راعي أن تكون الأمر والخصائص مرتبه بشكل جيد حتى تتمكن بعد ذلك
من التعديل عليها ومراجعتها بسهولة
Digg
Del.icio.us
Technorati
Twitterموضوع مهم يجب قراءته تم انتقال ادارة نيوستايل الى الاخ ahmed_totta
والله شرح وافى كافى وان شاء الله الاعضاء يستفادو من هذا الدرس
DiggDel.icio.usTechnoratiTwitter 
تسلم نيوستايل دروس رائعه
تسلم ايدك
DiggDel.icio.usTechnoratiTwitter شكراً لك وبارك الله فيك ..
DiggDel.icio.usTechnoratiTwitter كفو وتسلم على الدرس يالغالي شرح ولا أروع تقبل مروري ..
DiggDel.icio.usTechnoratiTwitter درس مميز وجميل في شرح إعطاء القيمة للعنصر
دمت بتميزك
DiggDel.icio.usTechnoratiTwitterالذين يشاهدون الموضوع الآن: 1 (0 من الأعضاء و 1 زائر)
ضوابط المشاركة
LinkBack URL
About LinkBacks
رد مع اقتباس
مواقع النشر (المفضلة)