أستغفر الله العظيم ... سبحان الله وبحمده



العودة   منتديات داماس > منتدى البرمجة العام > تطوير المواقع


مواضيع مميزة  


آخر عشرة مواضيع المواضيع النشطة


09-08-2014, 12:04 AM
Ahmad Saleh غير متصل
الوسـام الماسـي
رقم العضوية: 396430
تاريخ التسجيل: Jan 2012
الإقامة: Egypt - Alex
المشاركات: 3,045
إعجاب: 842
تلقى 1,241 إعجاب على 138 مشاركة
تلقى دعوات الى: 2599 موضوع
    #1  

CSS :: شرح الخاصية border-bottom


الخاصية border-bottom

border-bottom


في الدرس السابق من دورة CSS و CSS3 على هذا الرابط

دورة CSS و CSS3 باللغة العربية .. شرح مصور شامل

تعلمنا في الدرس السابق الخاصية Border وفهمنا القليل عنها
يرجى متابعة الدرس التالي للمعرفة اكثر
CSS :: شرح الخاصية border

وها نحن اليوم نتطرق لشرح الخاصية border-bottom
لا تختلف كثيراً الخاصية border-bottom في شرحها عن الخاصية border

المقصود بالخاصية border-bottom هو عمل حدود لمربع او اي شئ ولكن الضلع الاسفل في هذا المربع يكون مختلفاً عن باقي الاضلاع, ليس شرط ان يكون مربع , إنما هي حدود تتكون من اربع جوانب.

تعالو نقوم بتطبيق الكود التالي, افتح صفحة تكست فارغة واعطها الامتداد html ثم قم بوضع الكود التالي فيها:

<!DOCTYPE html>
<
html>
    <
head>
        <
style>
            
{
                
border-style:solid;
                
border-bottom:5px double #ff0000;
                
width:300px;
                
text-align:center;
            }
        </
style>
    </
head>
    <
body>
        <
p>Damasgate ForumsProgramsWindowsOfficeCoursesDVDCDMedical EngineeringSciencesEducational CDs, Global programsModify Windows, And accessed by more forums Damasgate</p>
    </
body>
</
html
والآن اغلق الصفحة و قُم بتشغيلها على متصفح الانترنت لترى التالي...

الخاصية border-bottom

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

border-style:solid = الحدود السوداء
border-bottom:5px double #ff0000 = سمك الحدود السوداء و الحد الاسفل المختلف

تعالوا نقوم بتوضيح الكود أكثر
الكود border-style:solid يقوم بإعطاء كل الحدود الاستايل العادي والذي يُسمى solid
اما الكود الآخر فـ هو مكون من أكثر من جزء انظر الكود مرة أخرى

border-left:5px double #ff0000

الكود هذه المرة أصبح بأسم border-bottom وهذا حتى يتم التطبيق على الجانب الاسفل من الحدود
ويمكننا تطبيق هذا ايضاً على Border-right يعني الجانب الايمن من الحدود
كما يمكنك كتابة border-top و border-left

5px وهي سُمك الحد الاسفل فقط اما باقي الحدود فهي أخذت الحجم الطبيعي او الإفتراضي الذي يتم تطبيقه في حال عدم كتابة سماكة الحدود.

double هو ستايل الجانب الاسفل وكما نلاحظ ان الجانب الاسفل عبارة عن خطين متوازيين
ff0000 هو اللون الأحمر من الوان الهيكس وهو ايضاً لون الجانب الاسفل كما بالصورة

وبهذا فهمنا ما هي الخاصية border-bottom
بالتوفيق للجميع الخاصية border-bottom





سبحان الله وبحمده .. سبحان الله العظيم
اللهم أغفر لأبي وأمي واسكنهم جنات الفردوس برحمتك يارب العالمين
اللهم أرحم موتى المسلمين جميعاً


المواضيع المشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
CSS :: شرح الخاصية border-right Ahmad Saleh تطوير المواقع 5 02-11-2016 08:12 PM
CSS :: شرح الخاصية border-left Ahmad Saleh تطوير المواقع 4 11-11-2014 12:00 PM
CSS :: شرح الخاصية border-top Ahmad Saleh تطوير المواقع 6 11-11-2014 11:58 AM
CSS :: شرح الخاصية border Ahmad Saleh تطوير المواقع 6 11-11-2014 11:53 AM
Border Defense eng_ama2005 العاب كمبيوتر PC Games 0 25-12-2008 03:20 PM
13-08-2014, 03:34 PM
emadmohamed غير متصل
عضو جديد
رقم العضوية: 390747
تاريخ التسجيل: Oct 2011
المشاركات: 5
إعجاب: 2
تلقى 0 إعجاب على 0 مشاركة
تلقى دعوات الى: 0 موضوع
    #2  
مشكورررررررررر

11-11-2014, 12:07 PM
omar karim غير متصل
عضو فعال
رقم العضوية: 21500
تاريخ التسجيل: Jul 2005
المشاركات: 149
إعجاب: 0
تلقى 48 إعجاب على 12 مشاركة
تلقى دعوات الى: 1 موضوع
    #6  
بارك الله فيك


وَمَا تَوْفِيقِي إِلَّا بِاللَّهِ عَلَيْهِ تَوَكَّلْتُ وَإِلَيْهِ أُنِيبُ

 


CSS :: شرح الخاصية border-bottom

English

Powered by vBulletin® Version
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
The owner and operator of the site is not responsible for the availability of, or any content provided.
Topics that are written in the site reflect the opinion of the author.
جميع ما يُطرح من مواضيع ومشاركات تعبر عن رأي كاتبها ولا تعبر عن رأي مالك الموقع أو الإدارة بأي حال من الأحوال.