مجله اینترنتی شماسافت جدید ترین اخبار،اموزش ها،مقالات و رویداد ها / برترین نکات سئو و اموزش های برنامه نویسی اخبار جالب روز و مشاوره های تحصیلی
اموزش border-radius در css3
باسلام خدمت شما همراهان مجله اینترنتی شماسافت در این پست و در ادامه اموزش مبحث برنامه نویسی – اموزش css قصد اموزش یک ویژگی جالب مربوط به border و حاشیه به نام border-radius داریم که به شما امکان میدهد حاشیه و بوردرهای عناصر صفحه وب خود را به صورت انحنا دار دراورید پس تا اخر این مطلب «اموزش border-radius در css3» همراه ما باشید.
border-radius :
شما میتوانید در مثال زیر عملکرد استفاده از border-radius در css3 را ببنید.
نحوه استفاده از کد border-radius در css3 به شکل زیر می باشد.
|
1 2 3 4 5 6 7 8 9 10 |
border-radius: 20px; /*هر چهارطرف عنصر به اندازه 20 پیکسل دارای انحنا میشود*/ border-radius:50%; /*حاشیه عنصر مورد نظر به صورت دایره شکل میشود*/ /*حالت های دیگر*/ /*border-radius:top left bottom right;*/ border-radius:10px 5px 10px 5px; /*به صورت تکی*/ border-top-left-radius:2px; border-top-right-radius:2px; border-bottom-right-radius:2px; border-bottom-left-radius:2px; |
مثال هایی از border-radius در css3 را میتوانید در زیر ببینید.
ممنون از اینکه تا آخر این مطلب همراه ما بودید شما میتوانید سوالات و نظرات خود را در قسمت دیدگاه ها برای ما ارسال کنید.
دیگر اموزش ها:
اموزش outline و margin و padding
اموزش اضافه کردن فونت به صفحه با font-face
