تبلیغات
p5soft | دانلود نرم افزار,طراحی سایت,طراحی قالب وبلاگ
پرواز تفریحی پاراگلایدر
پرواز تفریحی پاراگلایدر پرواز تفریحی پاراگلایدر

یکشنبه 10 آذر 1392

آموزش تصویری / کامل Css3 - مقدماتی تا پیشرفته

نویسنده: امیر حسینی   

رنگ RGBA در Css3

بازدید: 443

colorwhh

پیکی از ویژگیهای جدیدی که به  cssاضافه شده است پالت رنگ RGBA می باشد . اگر با ورژن قبلی css کار کرده باشید حتما میدانید که برای تعیین رنگ یک عنصر یا المنت از ترکیب رنگهای RGB یا درصد رنگ یا بهتر هست بگویم کدهای هگزا دسیمال که به این شکل FFFFFF# نوشته می شدند استفاده می کردیم .
RGBA چه قابلیت هایی رادر اختیار طراح قرار میدهد ؟  با استفاده از RGBA می توانیم شفافیت المنت مورد نظر را با استفاده از آلفا تغییر بدهیم و این درصد را کم یا زیاد کنیم . 

این ویژگی در اینترنت اکسپلورر10+ ، فایرفاکس 3+ ، کروم ، سافاری و اوپرا 10+ پشتیبانی می شود .

رنگهای RGB
نحوه نوشتن کدهای RGB به شکل زیر می باشد . 255 برابر است با رنگ قرمز - 0 برابر است با سبز ، 0 سوم برابر است با رنگ آبی |  rgb(red, green, blue
می توانیم از درصد هم برای استفاده از مقدار رنگها استفاده کنیم .  rgb(0%,0%,100%
هرچه مقدار عدد و درصد بیشتر شود ، درصد شفافیفت رنگ مورد نظر بیشتر می شود . 


برای درک بهتر بر روی کلید دمو کلیک کنید . 





p
{
background-color:rgb(255,0,0);
}

به مثال زیر دقت کنید .متن کامل کد را تایپ کرده ام . (در یک فایل نوت پد کپی کرده و با فرمت html.ذخیره کنید)


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
p
{
background-color:rgb(255,0,0);
}
</style>
</head>
<body>
<h1>به کدهای زیر توجه کنید</h1>
<p>This is some text in a paragraph.</p>
</body>
</html>

 

 مشاهده دمو 

 رنگ RGBA

این ویژگی در اینترنت اکسپلورر10+ ، فایرفاکس 3+ ، کروم ، سافاری و اوپرا 10+ پشتیبانی می شود .
با استفاده از RGBA می توانیم شفافیت رنگ را بوسیله کد آلفا تغییر بدهیم . دیگر نیازی نیست که درصد و مقدارها را کم یا زیاد کنیم . بوسیله مقدار Alpha که بین دو عدد 0.0 و 1.0 می باشد شفافیت نیز تغییر می کند .

روش نوشتن کدهای RGBA به شکل زیر می باشد rgba(red, green, blue, alpha

p
{
background-color:rgba(255,0,0,0.5);
}

به مثال زیر دقت کنید .متن کامل کد را تایپ کرده ام . (در یک فایل نوت پد کپی کرده و با فرمت html.ذخیره کنید)

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
p
{
background-color:rgba(255,0,0,0.3);
}
</style>
</head>
<body>
<h1>به  کادر زیر توجه کنید .هرچه عدد 3 بیشتر شود شفافیت افزایش پیدا می کند</h1>
<p>This is some text in a paragraph.</p>
</body>
</html>

مشاهده دمو

نظرات() 
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
What do you do for Achilles tendonitis?
دوشنبه 27 شهریور 1396 10:07 ب.ظ
This website was... how do you say it? Relevant!!
Finally I have found something which helped me.

Appreciate it!
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
foot issues
شنبه 18 شهریور 1396 07:04 ب.ظ
Hi there to every one, it's genuinely a nice for me to pay a visit this
web site, it consists of priceless Information.
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
Foot Complaints
سه شنبه 17 مرداد 1396 02:32 ق.ظ
Thanks for finally talking about >p5soft | دانلود نرم افزار,طراحی سایت,طراحی قالب وبلاگ
<Loved it!
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
Foot Problems
شنبه 14 مرداد 1396 03:55 ق.ظ
It's going to be finish of mine day, however before ending I am reading this great
article to increase my know-how.
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
plaza.rakuten.co.jp
جمعه 13 مرداد 1396 01:23 ب.ظ
For hottest news you have to pay a visit world-wide-web and on the web I found this web page as a most excellent site for
hottest updates.
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
Ricky
دوشنبه 9 مرداد 1396 09:42 ب.ظ
It's really very complicated in this busy life to listen news on Television, thus I just use internet for that reason, and obtain the
most recent news.
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
http://meaghankremple.hatenablog.com
جمعه 6 مرداد 1396 06:39 ب.ظ
I for all time emailed this web site post page to all my friends, for the reason that if like to
read it then my contacts will too.
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
Marta
دوشنبه 25 اردیبهشت 1396 05:03 ق.ظ
Good information. Lucky me I ran across your site by chance (stumbleupon).
I have book marked it for later!
فروش بیسیم پوکسینگ نمایندگی فروش بیسیم کنوود 3207 P5 BISIM
manicure
یکشنبه 20 فروردین 1396 11:53 ب.ظ
Saved as a favorite, I love your website!
 
لبخندناراحتچشمک
نیشخندبغلسوال
قلبخجالتزبان
ماچتعجبعصبانی
عینکشیطانگریه
خندهقهقههخداحافظ
سبزقهرهورا
دستگلتفکر

موضوعات

قالب فلش فوق العاده زیبا و حرفه ای
سئو چیست؟
وبلاگ های تازه طراحی و مطلب گذاری شده
به اشتراک گذاشتن اینترنت PC با موبایل از طریق usb
اتصال مستقیم تبلت به اینترنت adsl
دفترچه راهنمای فارسی گوشی هوشمند سامسونگ
راهنمای کامل فعال سازی اینترنت ایرانسل (GPRS و EDGE)، بسته های افزایشی و تعرفه‌های مربوطه
ساخت کاربر VIP برای سایت های وردپرسی
/طرح-لایه-باز-اسلایدر-سری-اول.
دریافت کد « ما را حمایت کنید 2 »
دانلود قالب گالری عکس
اسلاید شوی حرفه ای
کد اسلاید شو برای وبلاگ
قالب های حرفه ای وبلاگ همراه با اسلایدشو
ابزار نمایش اسلایدر تصاویر
ابزار اسلایدر عکس برای نمایش چندین تصویر در وبلاگ
قالب همراه با اسلاید شو
کد عضویت کاربر
دانلود اسکریپت مدیریت کاربران AuthManager نسخه ۳
عوامل موثر در افزایش رنکینگ سایت در گوگل
نمایش توضیحات برای یک فیلد در کنار آن به صورت Tooltip نمایش کد
اسلایدشو با قابلیت پیش نمایش فریم ها- کد جاوا
فیلم فارسی آموزش جاوا اسکریپت (JavaScript) – بخش اول
آموزش ساخت تاریخ و روز با جاوا
کد جاوا اسکریپت تغیر رنگ پس زمینه با کلیک بر روی یک دکمه/لینک
آموزش انتقال بازدید کننده از دامنه قدیمی به دامنه جدید سایت یا وبلاگ
پیش فرض چگونه جاوا اسکریپت را بر روی مرورگر فعال کنیم؟ (+آموزش تصویری)
دانلود کتاب آموزش جاوا اسکریپت صورت کامل
اسکریپت پرداخت آنلاین بانک پارسـیان
اسکریپت سئو سایت در موتور های جستجوگر seo paneL
مراقب لیست سیاه متور های جستجوگر باشید!!
افزونه رمز گذاری روی لینک های دانلود مخصوص vip کردن سایت+آموزش استفاده
25 افزونه کاربردی برای مرورگر کروم
25 افزونه کاربردی برای مرورگر کروم- part2
بازاریابی شبکه های اجتماعی
کلمات کلیدی مطلب : آموزش - تنظیمات - فیس بوک - امنیت فیس بوک - facebook -
آموزش کامل تنظیمات فیس‌بوک(قسمت اول)
5 اشتباه در رایج در شبکه های اجتماعی
ابزارهای بازاریابی شبکه های اجتماعی - نبض وب سایت تان را در دست بگیرید
5 راه برای فروش توسط شبکه های اجتماعی
سوالات و مشکلات سری d سامسونگ
آموزش تصویری / کامل Css3 - مقدماتی تا پیشرفته
ستون های چندگانه در Css3
آموزش تصویری / کامل Css3 - مقدماتی تا پیشرفته
مرجع کامل دستورات CSS2
آموزش ساختن منوی بازشو توسط CSS
آموزش ساخت منوی عمودی ساده با CSS
آموزش ساخت منوی افقی ساده با CSS
آموزش هک کردن فیس بوک
آموزش هک و جلوگیری از هک شدن مودم ADSL

آمار وبلاگ

  • کل بازدید :
  • بازدید امروز :
  • بازدید دیروز :
  • بازدید این ماه :
  • بازدید ماه قبل :
  • تعداد نویسندگان :
  • تعداد کل پست ها :
  • آخرین بازدید :
  • آخرین بروز رسانی :
  • P5design & PARAPINK5 Sales, I.R.I., Inc. All information applies to I.R. vehicles only
    tell number : 09365995390 | 09122061238 | 09022061238
    www.p5bisim.com