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: <pre class="prettyprint"><code>Some text </code></pre> What are the equivalent CSS sizes (in <code>px</code>, <code>em</code>, etc.) for these legacy font tag sizes?

from W3C http://www.w3.org/TR/html4/present/graphics.html#edef-FONT <blockquote> size = cdata [CN] Deprecated. This attribute sets the size of the font. Possible values: <ul> <li>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.</li> <li>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.</li> </ul> </blockquote> front this peice you could clearly see that equivalent to size will be <code>large or x-large .. etc</code> explanation : <code></code> is just as if you used <code>font-size: medium ;</code> <code></code> is just as if you used <code>font-size: large ;</code> <code></code> is just as if you used <code>font-size: x-large ;</code> <code></code> is just as if you used <code>font-size: xx-large ;</code> <code></code> is just as if you used <code>font-size: -webkit-xxx-large;</code> <hr> update : i think i have got it wrong the first time it's not em's (although they work similarly). please see the update :)

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 . <pre class="prettyprint"><code>/* <absolute-size> values */ font-size: xx-small font-size: x-small /* */ font-size: small /* */ font-size: medium /* */ font-size: large /* */ font-size: x-large /* */ font-size: xx-large /* */ font-size: -webkit-xxx-large; /* */ </code></pre> Reference <ul> <li>CSS font-size - Mozilla Development: https://developer.mozilla.org/en-US/docs/Web/CSS/font-size</li> </ul>

What is best replacement for in CSS?

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?

What do you think is the best way to set a font-size in CSS?

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.

What should I use for font-size CSS?

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.

Which value of the font-size is the same as 100% in CSS?

First and foremost, the current font-size is equal to 100% (i.e. 12pt = 100%).

What is the biggest font-size in CSS?

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 :

 is just as if you used font-size: medium ;

 is just as if you used font-size: large ;

 is just as if you used font-size: x-large ;

 is just as if you used font-size: xx-large ;

 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 :)

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

CSS font-size - Mozilla Development: https://developer.mozilla.org/en-US/docs/Web/CSS/font-size

What is best replacement for <font size="X"> in CSS?

Tags:

html

css

Snake Eyes

People also ask

2 Answers

Hussein Nazzal

abe

Recent Activity

Donate For Us