Is there a de facto connection between the font size ranges {1, 2, 3, 4, 5, 6, 7} and {xx-small, x-small, small, medium, large, x-large, xx-large}?

Question

In HTML / CSS format, the font size can be specified as follows (deprecated, but all browsers support it):

<font size="n">text</font> 

with n element {1, 2, 3, 4, 5, 6, 7} .

Another possibility is as follows:

 <span style="font-size: s;">text</span> 

with s element {xx-small, x-small, small, medium, large, x-large, xx-large} .

Is there any de facto connection between the two ranges? I figured they belong to the same dimensions as the seven elements, but that is not the case.

Answer 1

The short answer . No, it is defined in the browser. There is no standard display between them.

Long answer : check this document as it discusses the same issue in detail.

Answer 2

Please do not use any of these methods to indicate the font size. They were deprecated for a good reason. It is impossible to create a consistent look on different platforms using the methods you described - not to mention the fact that you are completely dependent on browser providers for what they specify as values ​​for each of them.

Use ems or percentages instead. You will get a much more consistent look, as well as much finer control over the font sizes required by your design.

Answer 3

Tim, with reference to your comment about bigmatty answers :

If you have Firebug running in Firefox, you can see the "Computed Style" of the elements - for example, while css StackOverflow defines the h2 tag (that is, around the heading "Your answer") as:

 h2 { font-family:Trebuchet MS,Helvetica,sans-serif; font-size:140%; font-weight:bold; margin-bottom:7px; } 

If I take a look at the Computed Style, I see that it is:

_{(source: doodle.co.uk )}

Which can help you in your search.

Answer 4

I think the (recommended) scaling factor between sizes is 1.2. CSS does not require a scaling factor.