HTML example code 1

      <!--
         To load an image from the web, you can use the <img />
         tag, with the attributes src that contain a link to the image.

         Other attributes such as title can be used to give the user a text popup if the user mouse over the image.

         The alt attribute is use if you want some text to be display if the image can not be load.

         The height attribute can be used to set the hight of the image, to resize the image, the unit that can be used are px, em, and %,

         An image dose not need to be a pair tag, as it dose not have any infomation between the tag but it is all in the attribues.

      -->
      <img src="http://www.google.co.uk/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"
          style="width:10%;"
          title="this is the google logo"
          alt="This is supose to show the google logo"/>

      <br>
      <br>
      <br>

      <!--
         To link to a web page you can use the <a> tag, also called the anchor tag.

         The attribute href is the url where you want the user to end up, so to link to google, you put href="www.google.com".

         The title attribue show the user a text box if they mouse over it.

         The target attribute tell the browers how to behaive if the user click the link,
         see the table below for the dffrent values and what they do.

         Target Value    Description
         _blank           Opens the linked document in a new window or tab
         _self           Opens the linked document in the same frame as it was clicked     (this is default)
         _parent        Opens the linked document in the parent frame
         _top            Opens the linked document in the full body of the window
         framename        Opens the linked document in a named frame

      -->
      <a href="https://www.google.com"
         title="Link to google"
         target=""> Google.com </a>
      <br>
      <br>
      <br>

      <p>
          <!--
             If you want an image to be a link you simply "wrap" the <img> tag with <a> tag
             with the attributes you have set, as it seen below
          -->
          <a href="https://www.google.com"
             title="link to google.com">
              <img src="http://www.google.co.uk/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"
                  style="width:10%;"
                  title="this is the google logo"
                  alt="This is supose to show the google logo"/>
          </a>
       </p>

      <br>
      <br>
      <br>

      <!--
        The attribue "style" can a list of pairs that are sepirated with a ;
        The pairs use CSS, with is always in pairs of two, name:value.
        Below is a list of comment css pairs you can input

        Name                decription                  sample values
        background-color    Set the background color    red, black, green, etc
                            of the element
        color               Set the color of the text   red, black, whith, etc
        font-family         Set the font family         verdana, courier
        font-size           Set the size of the font,   100%, 50%, 25.5%, etc
                            it is set in %
        text-align          how to align the text       center, right, left
        height              The height of the element   100%, 50%, 250px, 1000px, etc
                            Value offent set in px or %
        width               The with of the element     100%, 50%, 250px, 1000px, etc
                            Value offent set in px or %
       -->
      <h3 style="text-align:center">This head line is in the center</h3>

      <p style="background-color:black;
                color:white;text-align:center;">
        This is the first element that has a style to it
        <br>

        <b style="background-color:red;
                  color:blue;">
            This is the second element that has a style to it
        </b>
        <br>
        This is the third element that has a style to it
      </p>

    <!--
         This is the end of the first example
      -->