انجمن های تخصصی فلش خور

درود

دوستا امروز میخوام یه آموزش بزارم !

چیزه خاصی نیست

عملکرد : اضافه کردن دکمه ای که با رفتن موس روی اون رنگش تغییر میکنه و با کلیک یک رنگ دیگه میگیره !

طریقه ایجاد :

این کد ها رو در گلوبال . سی اس اس پوستتون وارد کنید :

کد:

کد: 

.button  { 

      display:  inline-block; 

      outline:  none; 

      cursor:  pointer; 

      text-align:  center; 

      text-decoration:  none; 

      font:  14px/100%  Arial,  Helvetica,  sans-serif; 

      padding:  .2em  2em  .22em; 

      text-shadow:  0  1px  1px  rgba(0,0,0,.3); 

      -webkit-border-radius:  .5em;  

      -moz-border-radius:  .5em; 

      border-radius:  .5em; 

      -webkit-box-shadow:  0  1px  2px  rgba(0,0,0,.2); 

      -moz-box-shadow:  0  1px  2px  rgba(0,0,0,.2); 

      box-shadow:  0  1px  2px  rgba(0,0,0,.2); 

 } 

 .button:hover  { 

      text-decoration:  none; 

 } 

 .button:active  { 

      position:  relative; 

      top:  1px; 

 }

 .orange  { 

      color:  #fef4e9; 

      border:  solid  1px  #da7c0c; 

      background:  #f78d1d; 

      background:  -webkit-gradient(linear,  left  top,  left  bottom,  from(#faa51a),  to(#f47a20)); 

      background:  -moz-linear-gradient(top,   #faa51a,   #f47a20); 

      filter:   progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a',  endColorstr='#f47a20'); 

 } 

 .orange:hover  { 

      background:  #f47c20; 

      background:  -webkit-gradient(linear,  left  top,  left  bottom,  from(#f88e11),  to(#f06015)); 

      background:  -moz-linear-gradient(top,   #f88e11,   #f06015); 

      filter:   progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11',  endColorstr='#f06015'); 

 } 

 .orange:active  { 

      color:  #fcd3a5; 

      background:  -webkit-gradient(linear,  left  top,  left  bottom,  from(#f47a20),  to(#faa51a)); 

      background:  -moz-linear-gradient(top,   #f47a20,   #faa51a); 

      filter:   progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20',  endColorstr='#faa51a'); 

 }

بعد به قسمت ی که میخواهید دکمه نمایش داده بشه برید مثلا header

و این کد رو وارد کنید :

<a href="#" class="button orange">Button</a>

ذخیره کنید و تمام

موفق باشید

نکته : تغییرات در کد های سی اس اس لازمه ی اطلاع شما از کد ها هستش و میتونید به رنگ ها وسایز های مختلف درش بیارید !

موفق باشید

☻امیرحسین☻