Instagram
اخبار سایت :
  • هیچی فقط همیشه سالم و سلامت باشین :دی

استایل جالب برای دکمه ها و یا باکس های دیگر شماره 2 (بدون استفاده از عکس)




www.moisrex.rozblog.com

این استایل (style) زیبا به باکس یا دکمه ها و ... شما رنگ و جلای خاصی می بخشد.

این کد با استفاده از سی اس اس (CSS) ساخته شده است و در آن هیچ عکسی به کار نرفته است.

این استایل در کد های css استفاده می شود و کسی که کدنویسی را کمی بلد باشد می تواند به راحتی از آن استفاده کند.

شما برای استفاده از این کد می بایست اول کد زیر را در head قالب خود قرار دهید (و یا این که آن را به صورت کد css در فایل css بگذارید):

و بعد برای هر باکس یا دکمه یا ... ای که می خواهید این استایل را داشته باشد از class (کلاس) moisrex-btn2 استفاده کنید:

<button class="moisrex-btn2"> کدستان </button>

این کد ممکن از در بعضی از مرورگر ها به درستی عمل نکند ولی تا حد امکان در آن مرورگر ها هم شبیه نسخه اصلی نمایش داده می شود و زیباستو هیچ مشکلی وجود ندارد.

برای استفاده این استایل در فایل css صفحه خود می توانید از کد زیر که در واقع همان کد بالاست کمک بگیرید:

.moisrex-btn2{
    background: #cb60b3;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NiNjBiMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2MxNDZhMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2E4MDA3NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkYjM2YTQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cb60b3), color-stop(50%,#c146a1), color-stop(51%,#a80077), color-stop(100%,#db36a4));
    background: -webkit-linear-gradient(top, #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
    background: -o-linear-gradient(top, #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
    background: -ms-linear-gradient(top, #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
    background: linear-gradient(to bottom, #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb60b3', endColorstr='#db36a4',GradientType=0 );
    box-shadow:0 0 0 1px #000;
    -moz-box-shadow:0 0 0 1px #000;
    -o-box-shadow:0 0 0 1px #000;
    -ms-box-shadow:0 0 0 1px #000;
    -webkit-box-shadow:0 0 0 1px #000;
    -khtml-box-shadow:0 0 0 1px #000;
    color:#fff;
    border-radius:5px;
    -moz-border-radius:5px;
    -ms-border-radius:5px;
    -webkit-border-radius:5px;
    -o-border-radius:5px;
    -khtml-border-radius:5px;
    border:1px #fff solid;
    padding:5px;
    margin:3px;
    font:12px tahoma;
    direction:rtl;
}

تشکر

نام
ایمیل (منتشر نمی‌شود) (لازم)
وبسایت
:) :( ;) :D ;)) :X :? :P :* =(( :O @};- :B /:) :S
نظر خصوصی
مشخصات شما ذخیره شود ؟ [حذف مشخصات] [شکلک ها]
کد امنیتی
کلاس های آنلاین فعال

برای افزایش دانش عمومی کاربران سعی بر این داریم که کلاس های آنلاینی برگزار کنیم. لیست این کلاس (ها) را می توانید در زیر ببینید. این قسمت را هر روز چک کنید تا از کلاس ها و اخبار جدید با خبر شوید. کلاس ها توسط همین کاربران و دوستان شما برگزار میشود. اگر مایل به برپایی کلاس آموزشی ای در هر زمینه ای هستید با مدیر تماس بگیرید.

مدرس: محمد و اقبال
آموزش PHP - جلسه اول
پنجشنبه 04 تیر 1394 - 17:00
هیچ کلاس فعالی موجود نیست.
کاربران آنلاین
آمار
مطالب : 792
نظرات : 4371
تعداد اعضا : 36612
افراد آنلاین : 3
بازدید امروز : 1,003
بازدید دیروز : 1,060
گوگل امروز : 71
گوگل دیروز : 127
بازدید هفته : 5,656
بازدید ماه : 28,012
بازدید سال : 373,611
بازدید کلی : 10,768,087