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?
The * selector selects all elements. The * selector can also select all elements inside another element (See "More Examples").
The attribute selector here is [type="button"] . This selector as a whole says “for all forms, select the input elements whose type attribute is button“. In other words, select all the form buttons in the page.
To create a button link to another page in HTML,just add <a> tag and wrap it around the simple Html button. Inside a <a> tag simply use href=“” attribute to give the path of the desired page.
Definition and Usage. URLs with an # followed by an anchor name link to a certain element within a document. The element being linked to is the target element. The :target selector can be used to style the current active target element.
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;
}
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;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With