Related Posts Widget for Blogs by LinkWithin

Friday, 14 March 2008

Basic HTML Part Two

In my last post about HTML I covered paragraphs/line breaks and bold and italic writing. This post covers links, pictures and colours.

Links

In the above paragraph, I made the words “last post” a link to my previous HTML post. The way to do this is to put link tags around the words “last post”. The code for link tags is “a” and we put pointy brackets around the tags and use a start and end tag just like before. However, the start tag contains some extra information to show where the link is to:

In my <a href=”http://sinnersavedbygod.blogspot.com/2008/02/basic-html-part-one.html”>last post</a> about HTML…


This would produce the result shown in my first paragraph.


Colour

Colour can be used for various things such as text and background. The colour can be defined ;ocally (in a similar way to the way bold and italic are done) or it can be predefined near the beginning of the page (for example, heading, link and “visited” link colours can be defined so that they all come out the same colour).

For now I will just discuss how to define colour locally. To do this, we use “font” tags. These would be <font> and </font>. Like with the links, we put extra information in the opening tag. This information is called an “attribute”. (We can also define the size and font of the writing but I will cover this another time.)

Here is how we can do it:

I like <font color=”red”>red</font> writing.

This would come out like this:

I like red writing.

Note the attribute “color” uses the American spelling.

Using a colour name we can choose a limited range of colours (red, yellow, green, blue, black etc.) but using a six-digit hexadecimal code number we have a choice of over 16 million colours. The code follows the format #rrggbb i.e. the first two digits define the amount of red used, the second two the amount of green used and the third pair the amount of blue used. “00” is the smallest amount and “FF” the largest. To explain a bit better, here are some examples:

#FF0000 = red

#00FF00 = green

#0000FF = blue

#000000 = black

#FFFFFF = white

Because it is designed for computer monitors which emit light, it is designed for mixing light (red, green and blue are the primary colours for light).

If I wanted to do the earlier sentence using the colour code I would write:

I like <font color=”#FF0000”>red</font> writing.

Of course it would be pretty difficult to work out the code for every colour you might want but definitions can easily be found:

http://en.wikipedia.org/wiki/Web_colors

http://www.logoorange.com/color/color-codes-chart.php

I found these fairly easily by searching for the keywords HTML, color and code in a search engine.

I will return to this on a later date.

Pictures/Images

The code for a picture or image is <img src=imageURL>. Where I have written "imageURL” you would enter the URL of the image. For example:

<img
src=”http://photos-d.ak.facebook.com/photos-ak-sctm/v162/218/49/865750507/n865750507_1956555_4111.jpg”>

Results in this:



If I remember correctly (I’m revising this from notes I made
five years ago) the image tag is the only one where an end tag is not required.

Next time I will cover a little bit of JavaScript which may
be helpful before returning to HTML.

1 comments:

Anonymous said...

Thank you for all your help. I have really learned a lot from you and your blog.

Post a Comment

"For there is not a word in my tongue, but, lo, O LORD, thou knowest it altogether." ~ Psalm 139:4

Comments are now moderated due to spammers. If you wish to make a private comment or you would like to leave a comment but are unable to do so, please feel free to use my contact form near the top right of my blog.

  © Blogger template ProBlogger Template by Ourblogtemplates.com 2008

Back to TOP