CSS Rounded Corners
الزوايا المدورة في لغة CSS
سوف تتعلم في هذا الدرس طريقة rounded corners الزوايا المدورة للعناصر سواء صور أو div أو اي عنصر له أبعاد وله border في لغة CSS.
التاريخ
28 نوفمبر 2021
الدروس
137
المستوى
مبتدئ
اللغة
انجليزي
المشاهدات
1948
المواضيع
24
CSS Rounded Corners
الزوايا المدورة في لغة CSS
</>
CSS Rounded Corners
الزوايا المدورة في لغة CSS
عن طريق خاصية border-radius في لغة CSS يمكننا عمل دوران لزوايا العناصر ويجب أن يكون للعنصر border حتي يمكن تدويرة.
CSS Rounded Corners
.item { flex:1; margin:20px; height:150px; border:#d63031 3px solid; background-color: #2196F3; border-radius:25px; }
</>
CSS Rounded Corners specify each corner
زوايا المدورة مختلفة لكل جانب في لغة CSS
يمكن عمل دوران لكل زاوية من زاويا العنصر وذلك عند وضع قيمة مختلفة لكل زاوية عن طريق خاصية border-radius x في لغة CSS.
ExampleCSS Rounded Corners specify each corner
.item1 { border-radius:50px 0 50px 0; }