Menu
I am working on updating an old website which uses font tags, to use CSS. The old HTML uses numeric font sizes (1-7) like this:
<font size="4">Some text</font>
What are the equivalent CSS sizes (in px, em, etc.) for these legacy font tag sizes?
928
You should set the font-size in the body tag to 100% . That way, people who visited your site will see the text at the right size for what they have set in their browser. For instance, people with low vision may set the text size larger. If your font-size is set to 100% , they should see it exactly as desired.
Set Font Size Using ems Another common way of setting the size of a font in CSS is to use em sizes. The em unit of measurement refers to the font size of a parent element. If you set a font's size to 2em , the font size will be twice that of the parent element.
First and foremost, the current font-size is equal to 100% (i.e. 12pt = 100%).
CSS doesn't have max-font-size , so if we need something that does something along those lines, we have to get tricky. Why would you need it at all? Well, font-size itself can be set in dynamic ways. For example, font-size: 10vw; .
from W3C
http://www.w3.org/TR/html4/present/graphics.html#edef-FONT
size = cdata [CN] Deprecated.
This attribute sets the size of the font. Possible values:
- An integer between 1 and 7. This sets the font to some fixed size, whose rendering depends on the user agent. Not all user agents may
render all seven sizes.- A relative increase in font size. The value "+1" means one size larger. The value "-3" means three sizes smaller. All sizes belong to the scale of 1 to 7.
front this peice you could clearly see that equivalent to size will be large or x-large .. etc
explanation :
<font size="3"> is just as if you used font-size: medium ;
<font size="4"> is just as if you used font-size: large ;
<font size="5"> is just as if you used font-size: x-large ;
<font size="6"> is just as if you used font-size: xx-large ;
<font size="7"> is just as if you used font-size: -webkit-xxx-large;
update :
i think i have got it wrong the first time it's not em's (although they work similarly). please see the update :)
124
xx-small, x-small, small, medium, large, x-large, xx-large A set of absolute size keywords based on the user's default font size (which is medium). Similar to presentational HTML's through where the user's default font size is .
/* <absolute-size> values */
font-size: xx-small
font-size: x-small /* <font size="1"> */
font-size: small /* <font size="2"> */
font-size: medium /* <font size="3"> */
font-size: large /* <font size="4"> */
font-size: x-large /* <font size="5"> */
font-size: xx-large /* <font size="6"> */
font-size: -webkit-xxx-large; /* <font size="7"> */
Reference
28
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
