General HTML/Web Design Programming Q`s/Font Size help
QUESTION: Can you help me with understanding one thing about Font Size?
I know Web Browsers Display Text at a Font Size of 11. or 12. by Default.
So if I use this code
I know my Text will have no change and it will be Displayed at the Browsers Default.
But if I use this code
Will my Text not be Displayed Two times bigger then the Browsers Default?
This is what I think from all I read.
ANSWER: Robert - if you declare font-size 200%, this means that the font for this particular text will be 200% larger than the default font on your webpage.
In the end, you can not determine how someone will view text - on all devices.
This is why we have Zoom in ad Zoom out and browser zoom levels.
You can determine the relative difference in size on your web page.
Heading 1 can be 150% larger than your default font
Heading 2 can be 125% larger than your default font
Perhaps the following will be helpful
You will see over and over again.
Percentages refer to the parent element's font size (of your page)
---------- FOLLOW-UP ----------
QUESTION: When I type my Title on my Page on the Body of the Page I do use
But all the Font Text I type on the Body of the Page I use this
<p style=”font-family:arial; font-size:200%”>
Because I know Web Browers Display Text at 12 or 12 Font Size. And I thought it will make my Text Two times bigger then the Web Browser Default Font Size.
This is what I ment to say.
Am I right on this?
Copy the following code into a notepad window, save the file as font.html .
Go to whereever you saved this file and open it, it will open in your browser window.
Now - edit the numbers, one at a time. Save the file - switch to this browser window and "Refresh" or F5.
You will see what happens and how this text looks using different parameters. I will tell you if you make the text too large your viewers will get annoyed so double check before you publish.
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<p>This is a paragraph.</p>
<p>Specifying the font-size in percent and em displays the same size in all major browsers, and allows all browsers to resize the text!</p>