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

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

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

دمو کد ۱

کد شماره ۱

<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">