Web design Tutorials Lesson 3.( Part 8)

Font Size with CSS

 There square measure lots of ways that to vary the font size with CCS.

You can amendment the dimensions of your page fonts with the font-size property. The values for the property, however, will be to a small degree difficult. Take a glance at these values for font-size:

font-size: 200%;
font-size: 32px;
font-size: 2em;
font-size: xx-large;

They are truly an equivalent size! strive them get in your code. Add the subsequent highlighted CUSS Style:

Save your changes and refresh the page in your browser. you must see the paragraph of text amendment size.

Now strive the opposite 3 sizes: two hundredth, 32px, and 2em. you must notice that they're all an equivalent size (or close to enough).

Which one you utilize is up to you. In older browsers, however, mistreatment the fastened sizes values of post exchange and em suggests that your users might not be ready to increase the dimensions of your fonts. This matters to those whose sight might not be good, and so want a much bigger font once reading your text. however browsers permit you to center and out by holding down the CTR L key and pressing + or -. (You reset by pressing CTR L then zero.) thus font-size values don't seem to be that necessary. lots of pros, though, can set the BODY tag's font-size to 100 percent, then use em because the price. Like this:

Style sheet showing example of multiple font sizes

This means that every one the font sizes between the 2 BODY tags square measure set to the browser's default size of 100 percent. In pixels, the default size in browsers is 16px. this can be up to 1em. The P tag higher than is setting the font-size to at least one and 0.5 times the default, whereas the category Channelization is setting the font-size to 2 times the default.

The other sizes square measure rarely used. however here they are:

xx-small
x-small
small
medium
large
x-large
xx-large
smaller
larger

Try them out and see what happens.



In the next half, you may study styling fonts.