MYP5

1. Text formatting

To structure a document, use tags:

`<p>`	paragraph with an empty line after itself
`<div>`	paragraph without an empty line
`<br>`	new line in the text

Basic tags for formatting the text:

`<b>`	bold
`<i>`	italic
`<u>`	underline

There are also attributes in CSS, with which you can modify the basic tags to create more interesting results:

`font-family`	changes the font-family (Arial, Verdana, Times New Roman...)
`font-size`	changes the size of the font
`font-style`	normal or italic
`font-weight`	normal or bold
`color`	changes the color of the text

These can be applied to tags that surround some text you wish to format. You can create identifiers p, b, i, div...


  <style type="text/css">

    body {background-color: blue;}

    p {font-family: verdana;

        font-size: 12;

        font-style: italic;

        color: white;}

    b {color:red;}

  </style>

2. Inserting an image

The tag for an image in HTML is <img>. This is another one of those tags which do not have a closing tag at the end.

The attributes of the <img> that we will use:

`src`	source of the image, for example <img src="images/car1.jpg">
`alt`	text to be displayed when the image can't be loaded; in Internet Explorer it is also a bubble help

Find and download suitable picture on the net. Put the picture into your web-page.

We will now see what tools we have for formatting the image in CSS.

These are the attributes for position of the image:
`margins`	margin-left and margin-right make an invisible space from left and right side of the image - the length is either in pixels or in % this allows you to move the image horizontaly margin-top and margin-bottom make an invisible space on the top and below the image - in px or % this allows you to move the inage vertically margins can be set also to auto (automatical)
These are the attributes for the border of the image:
`border-style`	can be solid, dotted, dashed, doubled, groove, ridge, inset, outset
`border-color`	changes the color of the border
`border-width`	sets the width of the line, in pixels or predefined thin, medium, thick

Example of usage:


  <style type="text/css">

    body {background-color: blue;

          color: white;}

    img {margin-left: 40%;

          margin-right: auto;

          border-style: double;

          border-color: purple;

          border-width: medium;}

  </style>