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

آخرین ارسال های تالار مشاهده انجمن

عنوانپاسخبازدیدتوسط
iconforumافزایش تعداد فالور اینستاگرام - بسیار بسیار ارزان225daymobile
iconforumافزونه کوتاه کننده لینک12195AHF-victory
iconforumلایسنس ویژوال کامپوسر653tiger2
iconforumراهنمای در مورد چند اسکریپت218tiger2
iconforumنرخ های جدید اینترنت همراه اول اعلام شد012AynaZ
iconforumخرید شریکی اسکریپت3237AynaZ
iconforumدرخواست هاست اسپانسری12225AynaZ
iconforumتغییر نکردن فونت سایت در وردپرس470AynaZ
iconforumطراحی492AynaZ
iconforumتغییر دامین در ورپرس9111AynaZ
iconforumدر پلاگین فرم تماس239AynaZ
درگاه پرداخت
درگاه پرداخت

گوشه های گرد در 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 میتونیم گردی افقی و عمودی هر گوشه را کنترل کنیم :

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

حتما بخوانید  دکمه‌های CSS3 متحرک زیبا با آیکون

یا

خوب مسائل اساسی 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,407دانلود افزونه تماس با ما Ninja Kick v.2.2.4 برای وردپرس تاریخ : 1393/10/21
2,883استایل شمارش صفحات بسیار زیبا CSS3 تاریخ : 1392/08/6
2,024درست کردن غرفه عکس با PHP, jQuery و CSS3 تاریخ : 1392/08/4
1,777منوی اجتماعی بسیار زیبای CSS3 تاریخ : 1392/08/6
2,326صفحه 404 بسیار زیبا Spotlook به صورت HTML5 تاریخ : 1392/09/19
3,530دانلود قالب HTML مترو و چندمنظوره STYLISH تاریخ : 1395/02/1
1,663اسکریپت منوی اجتماعی بسیار زیبا CSS3 تاریخ : 1392/08/10
4,218دکمه های اسلایدی زیبا برای باکس دانلود تاریخ : 1393/04/24
2,739دانلود تولتیپ بسیار زیبای CSS3 تاریخ : 1392/07/30
3,778اسکریپت جدول لیست قیمت ساده CSS تاریخ : 1392/08/7
4,247اسکریپت ایجاد افکت و انیمیشن در تصاویر سایت tFigure تاریخ : 1393/05/28
1,189افزونه وردپرسی نمایش هشدار در پنجره پاپ آپ برای ویژوال کامپوسر نسخه 1.2.1 تاریخ : 1394/08/7
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب