السلام عليكم ورحمة الله وبركاته
إخواني وأخواتي الافاضل
اليوم نقوم بشرح الخاصية
border-style
طالما ذكرنا كلمة ( style ) فذلك يعني أن هناك العديد من الاستايلات للحدود border , فكلمة بوردر تعني حدود وانواع الاستايل كالاتي :
border-style: none
border-style: hidden
border-style: solid
border-style: dotted
border-style: dashed
border-style: double
border-style: groove
border-style: ridge
border-style: inset
border-style: outset
دعونا نقوم بمثال لتجربة هذه الاستايلات , افتح صفحة تكست فارغة واعطها الامتداد html ثم ضع فيها الكود التالي ..
<!DOCTYPE html>
<html>
<head>
<style>
.minisoft{
width:200px;
padding:15px;
border-width:5px;
border-style: solid;
}
</style>
</head>
<body>
<p class="minisoft">
Mini Soft by Ahmad Saleh<br/>
Mini Soft by Ahmad Saleh<br/>
Mini Soft by Ahmad Saleh<br/>
Mini Soft by Ahmad Saleh<br/>
</p>
</body>
</html>
ثم احفظ الصفحة وافتحها على اي متصفح لتجد التالي ..
|
style solid |
رأينا الحدود بهذا الشكل .. يمكنك تجربة جميع الاستايلات بتغيير كلمة solid ذات اللون الأحمر وعموماً الاشكال جميعها كالتالي ..
|
style solid
|
|
style dotted |
|
style dashed |
|
style double |
|
style groove |
|
style ridge |
|
style inset |
|
style outset |
|
style none,hidden |
ملاحظة , style none او style hidden يقومون بإخفاء الحدود نهائياً و وظيفتهم واحدة
وبهذا أخذنا درس مٌسبط عن انواع ستايلات الحدود border
ارجو أن تستفيدوا , والى لقاء قادم بإذن الله
شكرا ع الشرح الرائع
ردحذف