Butoane cu efecte | Aspectul butoanelor | Butonul Descarcă - Pagina 3

Pentru a accesa toate paginile forumului

te rugăm să te înregistrezi

[ Cereri şabloane · Ultimile postări · Membrii · Regulamentul forumului · Căutare · RSS · Photoshop ]

Pagina 3 din 3
«
1
2
3

Butoane cu efecte | Aspectul butoanelor | Butonul Descarcă

Liber

Data: Marţi, 2012-10-09, 6:40 PM | Mesaj # 11

Total mesaje: 159

Vezi premiile: 5

Instalare: Panoul de Control - Design - Administrarea design-ului (CSS) - adăugați aceste stiluri:

Code

/* Aspectul butoanelor cu codurile BB */
input[type="button"]{
border:1px solid #c0c0c0;
background:#efefef;
cursor:pointer;
   border-radius:3px;
text-align:center;
text-shadow: 0 1px 1px white;
padding:3px;
}
input[type="button"]:hover{
border:1px solid black;
border-radius:3px;
background:-webkit-linear-gradient(top, white, #efefef,#c0c0c0);
cursor:pointer;
text-align:center;
text-shadow: white 0 0 2px;
padding:3px;
}
input[type="button"]:active{
border:1px solid black;
border-radius:3px;
background:-webkit-linear-gradient(top, #2D4DFF, #4463FF,#607DFF);
color:white;
text-shadow: 0 1px 1px black;
}

/* Aspectul butoanelor Adaugă răspuns, Căutare ș.a.m.d. */
input[type="submit"]{
border:1px solid #c0c0c0;
background:#efefef;
cursor:pointer;
   border-radius:3px;
text-align:center;
text-shadow: 0 1px 1px white;
padding:3px;
}
input[type="submit"]:hover{
border:1px solid black;
border-radius:3px;
background:-webkit-linear-gradient(top, white, #efefef,#c0c0c0);
cursor:pointer;
text-align:center;
padding:3px;
}
input[type="submit"]:active{
border:1px solid black;
border-radius:3px;
background:-webkit-linear-gradient(top, #2D4DFF, #4463FF,#607DFF);
color:white;
text-shadow: 0 1px 1px black;
}

Rezultatul:

Admin

Data: Sâmbătă, 2012-12-29, 5:29 PM | Mesaj # 12

Total mesaje: 84

Vezi premiile: 4

Pasul 1: Panoul de Control - Design - Administrarea design-ului (CSS) - adăugați stilurile:

/* Butonul Descarcă */
  a.sprite {
  display:block;
  width:109px;
  height:40px;
  background:url("http://fierbinte.ucoz.ro/Forum/Diverse/Descarca/Descarca_butoane.png");
  text-decoration:none;
  }
  a.sprite:hover {
  background-position:0 -40px;
  }
/* Butonul Descarcă */

Pasul 2: Panoul de Control - Design - Administrarea design-ului (şabloane) - Catalog de fişiere [Pagina cu textul integral de intrare şi comentariile sale] - unde doriți să apară butonul, adăugați codul:

<?if($FILE_URL$)?><a href="$FILE_URL$" class="sprite" title="Descarcă: $ENTRY_TITLE$"></a><?endif?>
<?if($RFILE_URL$)?><a href="$RFILE_URL$" target="_blank" class="sprite" title="Descarcă: $ENTRY_TITLE$"></a><?endif?>

Rezultatul:

În dictatură, cineva te foloseşte cum vrea el. În democraţie, ai dreptul să-l alegi pe cel care o să te folosească aşa cum vrea.

Admin

Data: Sâmbătă, 2012-12-29, 5:57 PM | Mesaj # 13

Total mesaje: 84

Vezi premiile: 4

Instalare: Panoul de Control - Design - Administrarea design-ului (CSS) - adăugați stilurile:

/* Aspectul butonasului*/
   .butonas {-moz-transition: all 0.3s ease 0s;-moz-box-sizing: border-
   box;background: url("FĂRĂ IMAGINE.png") repeat-x scroll center top #ECAE0F;border: 1px solid #00008B;border-radius: 3px 3px 3px 3px;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.43);color: #FFFFFF;cursor: pointer;display: inline-block;font-family: Calibri,'Trebuchet MS',Verdana,Geneva,Arial,Helvetica,sans-serif;font-size: 12px;font-style: normal;height: 26px;line-height: 26px;outline: medium none;width: 150px;padding: 0 6px;text-align: center;text-shadow: 0 -1px 0 #8CAD36;}
   a.butonas {color: #FFFFFF;display: inline-block;}
   .butonas:hover, .button[href]:hover, .buttonProxy:hover .button {background-
   color: #FAB80E; border: 1px solid #F3970C; color: #FFFFFF;text-decoration: none;}
   .butonas:active, .button.ToggleButton.checked, .buttonProxy:active .button
   {background-color: #ECAE0F; border: 1px solid #F3970C; color: #FFFFFF;outline: 0 none;}

iar în locul unde va fi butonul:

* Pentru a schimba culoarea și mărimea butonului, găsiți în stiluri: width: 150px și codurile culorilor (exemplu - #ECAE0F).

Rezultatul:

În dictatură, cineva te foloseşte cum vrea el. În democraţie, ai dreptul să-l alegi pe cel care o să te folosească aşa cum vrea.

Admin

Data: Joi, 2013-01-24, 3:23 PM | Mesaj # 14

Total mesaje: 84

Vezi premiile: 4

Butoanele Șterge, Adaugă, Restabilește și Salvează de la Adăugarea/Editarea intrărilor.

Instalare: Panoul de Control - Design - Administrarea design-ului (CSS) - adăugați stilurile:

Pentru butoane de culoare galbenă:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare galbenă */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
      display: inline-block;
      text-align: center;
      font-family: Arial, Helvetica, sans-serif;
      color: #ffffff;
      border-radius: 5px;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      font-size: 12px;
      font-weight:normal !important;
      padding: 6px 10px;
      border:1px solid #a26300;
      background: #ffc047;
      background: -webkit-gradient(linear, left top, left bottom, from(#ffc047), to(#ff9c00));
      background: -moz-linear-gradient(top, #ffc047, #ff9c00);
      background: linear-gradient(#ffc047, #ff9c00);
      cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
      border-color: #a26300;
      background: #ff9c00;
      background: -webkit-gradient(linear, left top, left bottom, from(#ff9c00), to(#ffc047));
      background: -moz-linear-gradient(top, #ff9c00, #ffc047);
      background: linear-gradient(#ff9c00, #ffc047);
}

Rezultatul:

Pentru butoane de culoare roșie:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare roșie */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
      display: inline-block;
      text-align: center;
      font-family: Arial, Helvetica, sans-serif;
      color: #ffffff;
      border-radius: 5px;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      font-size: 12px;
      font-weight:normal !important;
      padding: 6px 10px;
      border:1px solid #622929;
      background: #D55857;
      background: -webkit-gradient(linear, left top, left bottom, from(#D55857), to(#BD4544));
      background: -moz-linear-gradient(top, #D55857, #BD4544);
      background: linear-gradient(#D55857, #BD4544);
      cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
      border-color: #af4949;
      background: #ed7574;
      background: -webkit-gradient(linear, left top, left bottom, from(#ed7574), to(#D55857));
      background: -moz-linear-gradient(top, #ed7574, #D55857);
      background: linear-gradient(#ed7574, #D55857);
}

Rezultatul:

Pentru butoane de culoare albastră:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare albastră */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
      display: inline-block;
      text-align: center;
      font-family: Arial, Helvetica, sans-serif;
      color: #ffffff;
      border-radius: 5px;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
      font-size: 12px;
      font-weight:normal !important;
      padding: 6px 10px;
      border:1px solid #2C5660;
      background: #5CB6CE;
      background: -webkit-gradient(linear, left top, left bottom, from(#5CB6CE), to(#45A4BA));
      background: -moz-linear-gradient(top, #5CB6CE, #45A4BA);
      background: linear-gradient(#5CB6CE, #45A4BA);
      cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
      border-color: #4D9BAD;
      background: #79C9DA;
      background: -webkit-gradient(linear, left top, left bottom, from(#79C9DA), to(#5CB6CE));
      background: -moz-linear-gradient(top, #79C9DA, #5CB6CE);
      background: linear-gradient(#79C9DA, #5CB6CE);
}

Rezultatul:

Pentru butoane de culoare întunecată:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare întunecată */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
     display: inline-block;
     text-align: center;
     font-family: Arial, Helvetica, sans-serif;
     color: #ffffff;
     border-radius: 5px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
     -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
     -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
     font-size: 12px;
     font-weight:normal !important;
     padding: 6px 10px;
     border:1px solid #474747;
     background: #b0adad;
     background: -webkit-gradient(linear, left top, left bottom, from(#b0adad), to(#939191));
     background: -moz-linear-gradient(top, #b0adad, #939191);
     background: linear-gradient(#b0adad, #939191);
     cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
     border-color: #474747;
     background: #939191;
     background: -webkit-gradient(linear, left top, left bottom, from(#939191), to(#b0adad));
     background: -moz-linear-gradient(top, #939191, #b0adad);
     background: linear-gradient(#939191, #b0adad);
}

Rezultatul:

Pentru butoane de culoare purpurie:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare purpurie */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
    display: inline-block;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    color: #ffffff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
    font-size: 12px;
    font-weight:normal !important;
    padding: 6px 10px;
    border:1px solid #60295B;
    background: #B261A7;
    background: -webkit-gradient(linear, left top, left bottom, from(#B261A7), to(#AF4E9D));
    background: -moz-linear-gradient(top, #B261A7, #AF4E9D);
    background: linear-gradient(#B261A7, #AF4E9D);
    cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
    border-color: #AD4D9D;
    background: #CC7CB4;
    background: -webkit-gradient(linear, left top, left bottom, from(#CC7CB4), to(#B261A7));
    background: -moz-linear-gradient(top, #CC7CB4, #B261A7);
    background: linear-gradient(#CC7CB4, #B261A7);
}

Rezultatul:

Pentru butoane de culoare verde:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare verde */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
   display: inline-block;
   text-align: center;
   font-family: Arial, Helvetica, sans-serif;
   color: #ffffff;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   font-size: 12px;
   font-weight:normal !important;
   padding: 6px 10px;
   border:1px solid #4E612B;
   background: #A3CF59;
   background: -webkit-gradient(linear, left top, left bottom, from(#A3CF59), to(#93BC45));
   background: -moz-linear-gradient(top, #A3CF59, #93BC45);
   background: linear-gradient(#A3CF59, #93BC45);
   cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
   border-color: #8DAF4B;
   background: #C3DC78;
   background: -webkit-gradient(linear, left top, left bottom, from(#C3DC78), to(#A3CF59));
   background: -moz-linear-gradient(top, #C3DC78, #A3CF59);
   background: linear-gradient(#C3DC78, #A3CF59);
}

Rezultatul:

Pentru butoane de culoare neagră:

Cod

/* Butoanele Șterge, Adaugă, Restabilește, Salvează de culoare neagră */
.manFlSbm, .manFlRst, .postPreview, .postSubmit, .postReset, .pollSubmitBut, .pollreSultsBut, #sbt47 {
   display: inline-block;
   text-align: center;
   font-family: Arial, Helvetica, sans-serif;
   color: #ffffff;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
   font-size: 12px;
   font-weight:normal !important;
   padding: 6px 10px;
   border:1px solid #000;
   background: #535353;
   background: -webkit-gradient(linear, left top, left bottom, from(#535353), to(#0e0e0e));
   background: -moz-linear-gradient(top, #535353, #0e0e0e);
   background: linear-gradient(#535353, #0e0e0e);
   cursor:pointer;
}
.manFlSbm:hover, .manFlRst:hover, .postPreview:hover, .postSubmit:hover, .postReset:hover, .pollSubmitBut:hover, .pollreSultsBut:hover, #sbt47:hover {
   border-color: #000;
   background: #0e0e0e;
   background: -webkit-gradient(linear, left top, left bottom, from(#0e0e0e), to(#535353));
   background: -moz-linear-gradient(top, #0e0e0e, #535353);
   background: linear-gradient(#0e0e0e, #535353);
}

Rezultatul:

În dictatură, cineva te foloseşte cum vrea el. În democraţie, ai dreptul să-l alegi pe cel care o să te folosească aşa cum vrea.

Butoane cu efecte | Aspectul butoanelor | Butonul Descarcă

Pagina 3 din 3
«
1
2
3