HTML, CSS..: different font size in buttons and selects than for plain text (at least in FF)
I have this rule:
body {
font-family: Arial,Helvetica,sans-serif;
font-size: 12px
}
but i have different font s开发者_开发知识库ize for the selects and the buttons then for plain text.
What should i do if i want the same size for everything?
Regards
Javi
formular elements usualy don't inherit those properties, so you have to do:
body{
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
}
input, select, button{
font-family: inherit;
font-size: inherit;
}
body,
input,
select,
button {
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
}
By default, form elements like input of type text and password (submit and button ?), select, textarea and button are styled with a monospace font with a resulting size of approx. 13.33px.
You can check C:\Program Files\Firefox\res\forms.css (under WinXP) or with Firebug in the HTML part, the little triangle at the right of Style tab ==> Default CSS properties
body {
font: normal 62.5%/1.5 Verdana,Arial,Helvetica,sans-serif;
}
input, select, textarea, button {
font-size: 1.2em;
}
p {
font-size: 1.2em;
}
will result in 12px+Verdana form elements (and 1em = 10px equivalence for your whole page)
body {
font-family: sans-serif;
}
button {
font:inherit
}<html>
<head>
</head>
<body>
<p>An example of a sans-serif font</p>
<button>Cick Me</button>
</body>
</html>Not sure about buttons, but most browsers try to style <select> elements in a standard way (e.g. 12-point Arial). If you want to change the style of these, you have to add an explicit CSS rule:
select {
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
}
加载中,请稍侯......
精彩评论