طراحی و بهینه سازیمشاهده


 

آموزش وردپرس WordPressآموزش وردپرس WordPress سایت

آموزش جی کوئری jQueryآموزش جی کوئری jQuery جاوا اسکریپت

آموزش انگولار جی اس Angular JS آموزش انگولار جی اس 2 AngularJS 

آموزش اچ تی ام ال HTML5 CSS3آموزش HTML5 و CSS3 اچ تی ام ال 5

آموزش پی اچ پی PHPآموزش پی اچ پی PHP پک 1 برنامه نویسی وب

آموزش سئو SEO آموزش سئو سایت و وردپرس SEO گوگل 

آموزش هک قانونی آموزش هک قانونی - نفوذ و امنیت - پک1

آموزش برنامه نویسی اندروید استودیو  آموزش برنامه نویسی اندروید استودیو  

آموزش زامارین Xamarinآموزش زامارین Xamarin برنامه نویسی موبایل

هاست

گوشه های گرد در CSS3،بررسی Border-radius

CSS / HTML , آموزش طراحی
گوشه های گرد در CSS3،بررسی Border-radiusReviewed by جواد on Oct 19Rating: 3.0گوشه های گرد در CSS3،بررسی Border-radiusبا به روی کار آمدن html5 و CSS3 دنیای طراحی وب تغییری اساسی کرد. امکانات بسیار زیادی به نسخه های جدید html و css شده که تقریبا هر چیزی را طراحی کنید

با به روی کار آمدن html5 و CSS3 دنیای طراحی وب تغییری اساسی کرد. امکانات بسیار زیادی به نسخه های جدید html و css شده که تقریبا هر چیزی را طراحی کنید ،  امروز میخوایم درباره گوشه های گرد به طور کامل صحبت کنید ، گوشه های گرد رو میتونید با استقاده از Border-radius ایجاد کنید.

خیلی از طراحان با خاصیت border-radius آشنا هستند اما در واقع این خاصیت چیزی بیشتر از border-radius : 5px; هست ، امروز یکم عمیق تر این خاصیت رو بررسی میکنیم و به شما نشون میدیم که چجوری میشه تک تک گوشه ها رو گرد کرد یا اینکه چجوری میشه به صورت افقی و عمودی گوشه ها را گرد کرد.

خوب معمولی ترین border-radius به این صورت هست :

که تمام گوشه ها را به اندازه ۵ پیکسل گرد میکند.

برای این که هر گوشه رو جداگانه گرد کنیم انجوری عمل میکنیم :

همش همین نبود ، به وسیله border-radius میتونیم گردی افقی و عمودی هر گوشه را کنترل کنیم :

همچنین میتونم به هر گوشه به طور جداگانه این خاصیت رو اعمال کنیم :

یا

خوب مسائل اساسی border-radius را گفتیم ، برای ورژن های قدیمی مرورگر های فایرفاکس و کروم باید از -webkit و -moz استفاده کنیم که استفاده از -moz کمی متفاوت با چیزی است که تاحالا گفتیم

برای -webkit هم کافیست به جای border-radius بنویسید  : -webkit-border-radius


به کانال تلگرام بیست اسکریپت بپیوندید !

دانلود






دستگاه جوجه کشی


مطلب مفیدی بود ؟
نویسنده : admin تاریخ : 1392/07/27 3 CSS / HTML , آموزش طراحی

لینک کوتاه مطلب : http://www.20script.ir/?p=97

کلمات کلیدی پست :
درگاه پرداخت
مطالب مرتبط
4,842منوی بسیار زیبای ایکون دار به صورت CSS3 تاریخ : 1393/04/30
3,282افزونه ایجاد کتاب های الکترونیک سه بعدی dFLIP برای وردپرس تاریخ : 1395/08/7
2,581اسکریپت 9 سبک خاص آیکون های متحرک شبکه های اجتماعی تاریخ : 1395/04/22
4,811دانلود قالب Arch مناسب معماران و عکاس ها برای وردپرس تاریخ : 1394/02/25
2,917دانلود باکس های اطلاعیه Flat Modern Notifications تاریخ : 1392/09/3
4,692دانلود قالب HTML مترو و چندمنظوره STYLISH تاریخ : 1395/02/1
12,913افزونه تبلیغات حرفه ای با NagAds برای وردپرس تاریخ : 1393/09/20
3,159دانلود منو حرفه ای و جدید بسیار زیبای CSS3 تاریخ : 1392/09/2
3,160قالب مدیریت وب سایت AdminDesigns به صورت HTML تاریخ : 1394/01/19
2,315افکت های شناور CSS3 تاریخ : 1392/08/8
5,233اسکریپت ایجاد افکت و انیمیشن در تصاویر سایت tFigure تاریخ : 1393/05/28
1,872اسلایدر قدرتمند با بیش از 12 تم UnoSlider برای وردپرس تاریخ : 1394/06/15
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب