Page 47 - DCAP408_WEB_PROGRAMMING

Unit 2: Creating Static Web Pages

<p>This is_subscript and ^superscript</p> Notes
</body>
</html>
Result: The visual result for the above code is shown below:

This text is bold
This text is strong

This text is big

This text is italic

This text is emphasized

2.1.9 Changing Fonts

You can change the size of text similarly by writing
<p style=”font-size:250%”>Pretty large text</p>
<p style=”font-size:50%”>Pretty small text</p>
Here, the first line is displayed in a large font size, the second line in a small font size. If you
don’t want to change the size of text for a whole paragraph, but just for a passage (a sequence of
words) within a paragraph, for example, you can use the “span” tag:
<p> This text is in normal size. Now,
<span style=”font-size:250%”>this is large</span> and now we go
back to normal size.
</p>
Again, you might come across a deprecated older tag for specifying text properties (size, face
and color): the <font> tag. For setting size, it was used like this: <font size=”5">Here is a size 5
font</font>, and you could set 7 different levels of sizes from 1 (smallest) to 7 (largest), where
the default was 3.

Notes However, the recommended method for setting text properties nowadays is via
styles, as shown before.

To change the font type, you can use “font-family”. Choose a different font face using any font
you have installed. Be aware that if the user viewing the page doesn’t have the font installed, it
will not be displayed. Instead, the default font Times New Roman (which is a default browser
setting) will be displayed. An option is to choose a few fonts that are similar in appearance:
<span style=”font-family:Arial,Verdana,Helvetica”>nice font...</span>
If you specify various fonts like this, the browser will try the first one first, and if that font is not
installed, the second, and so on.
The old way was to use the element “font” with the attribute face:
<font face=”Arial”> some text </font>.

LOVELY PROFESSIONAL UNIVERSITY 41