banner
Welcome to HTML.co.uk, the number one resource for all news, information, and happenings regarding HTML.

Updates: HTML.co.uk has just been relaunched. Subscribe to our RSS Feed to stay on top of HTML news and techniques.
May
14th

HTML: Extended Fonts and Text Colours

Author: Editor | Files under HTML Basics, HTML Tutorials
Tags for this article: , , ,

HTML has successfully initiated the web language era. It all began with Lee’s attempts i.e., the new era of web based services. Lee tried to share documents between two computers and for that purpose he developed the HTML language. A language developed solely for sharing purposes has come a long way and is the most widely used to link documents on your web browser and determine the documents’ attributes and layouts.

HTML is not the only language used for this purpose, but is the main tool for web page designing and linking. Its competitive features and user friendly approach have made it a hit with all programmers involved in designing. Once you get the feel of this language, you too will find it easy to use. We already know a many things about the HTML language. Here we will solely discuss the fonts and colours used in the HTML language. You can add some fonts to the web browsers other than the ones normally used. Many web pages do not support the use of extended fonts or colours i.e. there is no option for font or colours in the web page. You can even add a font or colour tool to the web page. In this way you can change the font type or the colour of the font. Now this can be done using a simple code.

FACE=&quotfont_name”
Let us check out a few examples of how you can have your own extended font on the web page.

Verdana font. For this simply use this code: <font size=+2 face=”Verdana”>Verdana</font>
Arial font. For this simply use this code: <font size=+2 face=”Arial”>Arial</font>
Helvetica font. For this simply use this code: <font size=+2 face=”Helvetica”>Helvetica</font>
Comic Sans font. For this simply use this code: <font size=+2 face=”Comic Sans MS”>Comic Sans MS</font>
Font impact. For this simply use this code: <font size=+2 face=”Impact”>Impact</font>

You can clearly understand the structure from one code itself. The necessity for so many examples is that you need to understand that there is a basic similarity and what it is. You just need to change the name of the font for the type of font you want in the tool bar. Otherwise the code remains the same whatever the font you are interested in.

Now that is simple isn’t it? No wonder most people prefer using the HTML codes for scripting for web pages instead of any other language. You should also remember that for you to see the above fonts or the fonts you want, the web browser you use should support the fonts. Now that we have seen the fonts, why don’t we move on to the colours? You can change the text colour too if you so desire. All you need to do for that is use COLOR=”font color” in the tag. With this code you can change the colour according to your choice. E.g. If you want your font colour to be yellow all you need to do is write Hey I’m Yellow! and font colour is yellow.
Simple , isn’t it?


May
6th

Defining Colour in HTML

Author: Editor | Files under HTML Basics, HTML Tutorials
Tags for this article: , , , ,

Colours can be defined in many different contexts in HTML, for example:

  • File wide background colours
  • Font colours for blocks of text
  • Background colours in tables

Although all these designations have since been characterised as deprecated by the W3 consortium, which means they should no longer belong to the language standard in the future. The reason is that all of these colours can be defined with the help of style sheets. CSS, not HTML, is now the language for graphics. Nevertheless, it is worth learning how to define these colours in HTML, because although the same functions exist in CSS, the language also has many more possibilities. We will discuss the subject from a CSS viewpoint in a later section.

There are fundamentally two possibilities for defining colour in HTML:

  • Choose the desired colour in hexadecimal form through designations of RGB values (RGB= red/green/blue)
  • Through the designation of a colour name

If you enter hexadecimal inputs, then you work independently of the browser, and you have the total freedom of choosing from 16.7 million colours.

If you choose to simply the enter the colour name, then you bypass the somewhat complicated method of defining a colour in the hexadecimal mode. However, there are currently only 16 standardised colours. Additional colour names exist, but they are browser dependent.

The hexadecimal entry of colours

If you wish to define colours directly in the hexadecimal mode, then you must select the desired colour from designations for the three base colours, red, green and blue.

An Example:

<body bgcolor= “#808080”> <!– dark grey file background –>
<table bgcolor= “#00C0C0”> <!– blue green table background –>
<hr color= “#CC00CC”> <!– violet divider –>

Explanation:

Every hexadecimal colour definition has six digits and follows the formula: #RRGGBB

First notate a “#”. Six characters then follow and define the colour. The first two define the red value of the colour, the second two define the colour’s green value, and the final two define the colour’s blue value.

Hexadecimal Digits:

0 (corresponds to the decimal 0)
1 (corresponds to the decimal 1)
2 (corresponds to the decimal 2)
3 (corresponds to the decimal 3)
4 (corresponds to the decimal 4)
5 (corresponds to the decimal 5)
6 (corresponds to the decimal 6)
7 (corresponds to the decimal 7)
8 (corresponds to the decimal 8 )
9 (corresponds to the decimal 9)
A (corresponds to the decimal 10)
B (corresponds to the decimal 11)
C (corresponds to the decimal 12)
D (corresponds to the decimal 13)
E (corresponds to the decimal 14)
F (corresponds to the decimal 15)

Therefore, a hexadecimal digit can have 16 different conditions.

Take Note:

There are 16 base colours that can be displayed by every VGA compatible screen

There are also 216 colours, which have developed into the internet’s standard colour palette. We will discuss these colour palettes in greater detail in a separate section.

In order to make defining colours easier, colour selectors also exist.

Names for the basic 16 colours

An Example:

<body bgcolor= “black”> <!– black file background –>
<table bgcolor= “aqua”> <!–light blue table background –>
<hr color= “red”> <!– red divider –>

Enter the desired colour names in the place where colour designations are allowed.
In order to get an overview of the available colours, you can enter the example above. The hexadecimal values, that correspond to colour names, will then be shown.