چند استایل زیبا برای دکمه ها ی سایت

چند استایل زیبا برای دکمه ها ی سایت با سلام امروز برای شما چند استایل زیبا برای دکمه های سایت اماده کردم که در زیباسازی سایت بسیار مفید بوده.شما میتوانید استایلها را در فایل استایل قالب خودتون جایگزین و یا به انتهای استایل اضافه کنید.و برای وبلاگ هم میتوانید در هد قالب وبلاگ قرار داده و از استایل زیبای دکمه ها استفاده نمایید.

چند استایل زیبا برای دکمه ها ی سایت
نمونه استایل ۱
چند استایل زیبا برای دکمه ها ی سایت
نمونه استایل ۲
چند استایل زیبا برای دکمه ها ی سایت
نمونه استایل ۳

دمو کد ۱

کد شماره ۱

<div style="display:none"><h1><a title="&#1705;&#1583;&#1576;&#1575;&#1586;&#1575;&#1606; - &#1705;&#1583;&#1587;&#1578;&#1575;&#1606;" href="https://codebazan.ir">codebazan</a></h1></div>
<style>
INPUT
{
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding-bottom: 4px;
    line-height: 18px;
    padding-left: 4px;
    padding-right: 4px;
    display: inline-block;
    height: 25px;
    color: #808080;
    font-size: 13px;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    padding-top: 4px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
</style>

<input value="نمونه  کار " type="reset">

دمو کد۲

کد شماره ۲

<div style="display:none"><h1><a title="&#1705;&#1583;&#1576;&#1575;&#1586;&#1575;&#1606; - &#1705;&#1583;&#1587;&#1578;&#1575;&#1606;" href="https://codebazan.ir">codebazan</a></h1></div>
<style>
input,span{
      
      border:20px;
      padding:3px;
      border-bottom: 5px solid #909090;
      border-left: 5px solid #ccc;
      border-right:5px solid #ccc;
      border-top:5px solid#909090;
      background-color:#ccc ;
      border-radius: 5px;
      font-size:14px;
      
      margin:0 auto;
	color:#fff;
	text-align:center;
	
	transition:all 0.5s ease-in-out;
 }

input:hover{

width:150px;
	letter-spacing:2px;}
</style>


<input value="کدبازان - کدستان " type="reset">

دمو کد ۳

<div style="display:none"><h1><a title="&#1705;&#1583;&#1576;&#1575;&#1586;&#1575;&#1606; - &#1705;&#1583;&#1587;&#1578;&#1575;&#1606;" href="https://codebazan.ir">codebazan</a></h1></div>
<style>
INPUT
{
    border-bottom: 3px solid #ccc;
    border-left: 3px solid #ccc;
    padding-bottom: 4px;
    line-height: 18px;
    padding-left: 10px;
    padding-right: 10px;
    display: inline-block;
    height: 27px;
    
    font-size: 14px;
    border-top: 3px solid #ccc;
    border-right: 3px solid #ccc;
    padding-top: 3px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 30px;
}
</style>

<input value="نمونه  کار " type="reset">

4 Comments

  1. سلام این چن روزکه من تو سایتتون بودم چقدر سایتتون قشنگ زیبا شده
    تازه مطالب پیشنهای هم استفاده کریدن
    همینطور ادامه بدین
    با تشکر.

    رضا

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *