بسم الله والحمد لله الذي لا يحمد علي شئ سواه
ابدا الدرس الخامس في دوره تعلم css
انتهينا في السابق من عمل
الهيدر للصفحه
وقائمه جانبيه يمني
وقمنا بعمل الفوتر
نبدا علي بركه الله في هذا الدرس بعمل قائمه علي الجهه اليسري للصفحه
تابع معي
نقوم بوضع الكود التالي داخل ملف index
مواقع صديقه
وذلك قبل الوسم الخاص
بالقائمه اليمني
انظر للصوره التاليه
ونضيف في ملف style.css
الاتي
ثم نضيف ايضا الكود التالي
#side_left {
float:left;
width:180px;
}
لجعل القائمه الجانبيه علي الشمال وعرضها 180 بكسل لو نقطه
ثم نضيف الكود التالي ايضا في ملف style
img {
border:none;
}
لازاله الحدود من الصوره لاضفاء لمسه جماليه عليها
ثم نضيف ايضا الكود التالي
#content {
margin-right:180px;
margin-left:180px;
padding:10px;
}
وهو موجود سابقا ولكن سنضيف اليه السطر
margin-left:180px;
انظر الصوره التاليه والتي تبين الاضافات في ملف
style.css
ولكن
يجب اضافه الكود التالي مهم جداا
اولا في index
ومهمته هناا هي تعويم الفوتر بمعني ان يجعله لا يتداخل من باقي عناصر الصفحه
انظر للصوره التاليه
ونضيف الكود التالي في style.css
.clear {
clear:both;
}
في النهايه تكون الصفحه لدينا قد وصلت الي الشكل التالي
ارجو ان اكون وفقت في ايصال معلومه
او استفاده لاي احد
تابعو عي الدرس القادم لاكمال صفحتنا الرئيسيه باستخدام
html ,css
حمل ما قمنا بعمله من هناا
http://bit.ly/9ErI5o
ليست هناك تعليقات:
إرسال تعليق