سؤال حول border

frontend

#1

هل يمكن ان نقوم بتحديد إطار واحد لتجاهين في سطر واحد ؟


#2

نعم تستطيع وهذا مثال بسيط

    border-style: solid;
  border-width: 5px 10px 15px 20px;

اول قيمة الي رقمها 5x هذي قيمة البوردر الاعلى
والقيمة الثانية الي رقمها 10 هذي قيمة البوردر الايمن
والقيمة الثالثة الي رقمها 15 هذي قيمة البوردر الاسفل
والقيمة الرابعة الي رقمها 20 هذي قيمة البوردر الايسر
المقصود عندما تريد كتابة البوردر في سطر واحد فيكون
اول قيمة تعطيها تروح للبوردر الاعلى وثاني قيمة للبوردر
الايمن وثالث قيمة للبوردر الاسفل والرابعة للبوردر الايسر

    border-width: top right bottom left;

واذا كنت مثلا تريد ان تعمل بوردر ايمن وايسر فقط فتضع بقيمة الtop 0px وبقيمة الbottom ايضاً px0
اتمنى اكون كدرت اوصل لك الفكرة بشكل صحيح


#3

فهمت مرادك اخي شكرا لك .
لكن سؤالي انا هو
p{
Border-left-right: width style color;
}
هل هذا الكود صحيح ؟


#4

لا غير صحيح لايمكن اي يطبق هكذا
يجب ان يكون اللون على حدة والحجم على حدة والستايل على حدة


#5

اخي هل انت متاكد من هذه المعلومات لاننا درسنا انه يمكن كتابة الحدود في سطر واحد وبهذه الطريقة
P{ border: width style color;
}


#6

تستطيع تكتب الحدود في سطر واحد ولكن انت تريد تكتب Border-left-right: وتحطلهم خصائص واصلاً لايوجد في css امر كهذا
تستطيع ان تستخدم اقل شيء ثلاث خصائص مثال

border-color: red green white blue;
border-style: solid dashed dotted solid;
border-width: 1px 2px 3px 4px;

بس بالنسبة لرأيي هيج راح يكون فوضوي بالنسبة لي افضل اكتبها بهذا الشكل ويبقى الخيار لك

border-top:    1px solid  #ff0;
border-right:  2px dashed #f0F;
border-bottom: 3px dotted #f00;
border-left:   5px solid  #09f;

#7

كما أشار لك @mohamed1، لا تستطيع إستخدام border-left-right وإنما بإستخدام الخاصية border-width تقوم بتحديد مدى عرض الحدود لكل اتجاة كما في المثال التالي:

border-style: solid;
border-width: 0 20px 0 20px;
border-color: red;

في الكود أعلاة حددنا قيمة الحد من اليمين واليسار بقيمة 20px وبقيمة 0 من الأعلى والأسفل

 border-width: top right bottom left;

إذا بدك معلومات أكثر او شئ مش واضح كلمتنا


#8

الان لقد فهمت وفكرتك لقد وصلت شكرا لك اخي :green_heart: