tags:

views:

45

answers:

4

I have created a CSS style class:

.btn { 
  color:#050; 
  font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
  background-color:#fed; 
  border:1px solid; 
  border-color: #696 #363 #363 #696; 
} 

How can I apply this CSS style class to all buttons which are present in the page without adding class="btn" to every button?

+1  A: 
button{ 
  color:#050; 
  font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
  background-color:#fed; 
  border:1px solid; 
  border-color: #696 #363 #363 #696; 
} 

OR

input[type="button"]{ 
  color:#050; 
  font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
  background-color:#fed; 
  border:1px solid; 
  border-color: #696 #363 #363 #696; 
} 
Aman Kumar Jain
The second example is **not** CSS3. The attribute selector already exists in CSS2.1. It was only expanded in CSS3. http://www.w3.org/TR/CSS2/selector.html#attribute-selectors
Yi Jiang
Have updated the answer :) Thanks.
Aman Kumar Jain
+1  A: 

If your buttons are <input type="button"> or submit, then this should do it:

input[type="button"], input[type="submit"] { 
    color:#050; 
    font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
    background-color:#fed; 
    border:1px solid; 
    border-color: #696 #363 #363 #696; 
} 

Otherwise, if your buttons are <button>:

button { 
    color:#050; 
    font: old 84% 'trebuchet ms',helvetica,sans-serif; 
    background-color:#fed; 
    border:1px solid; 
    border-color: #696 #363 #363 #696; 
}

To grab all three kinds of buttons:

button, input[type="button"], input[type="submit"] { 
    color:#050; 
    font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
    background-color:#fed; 
    border:1px solid; 
    border-color: #696 #363 #363 #696; 
} 
Delan Azabani
i'm using asp.net so its like <asp:button Id="Button1" Text="Button"/>
ashu
+1  A: 
input[type=submit], input[type=button], button {
   ...
}
Marc B
A: 

just a note

input[type="button"]

isn't going to work on old browsers like IE6. If that's a problem you will unfortunately need to add your class to each item.

lnrbob
@all .. thxs 2 all
ashu