HTML Styles

HTML Styles provides a way for you to structure and beautify your HTML webpage.

Example

You will start doing things like the above by the end of this lesson.

Although all HTML elements come with there default styles, it bests it most knowing that these styles can also be modified and improved to suit your imagination.

This modification and improvement can be done using the style attribute.

Getting into HTML styling is a gradual process because one needs to learn and study how styles would satisfy your web page visitors before deciding what styles to use.

HTML Style attribute Syntax

HTML uses the style attribute to apply inline CSS styles to HTML:

style="property:value;"

Explaination

  • The property name is a CSS property
  • The value is a CSS value corressponding to the property.
You will learn more about CSS in our CSS Tutorial.
This examples creates an HTML text field with a red text color:

Example

More Styles Properties

Background Colors

The background of any HTML element can by determined be the background-color property.

Example

Font Sizes

The font size of an HTML text can be set by the font-size property, the example below sets the font size of the whole document to 21px.

<body style="font-size:21px"></body>

Borders

Borders are lines that surround an HTML element.

The border of any HTML element can be determined by the border property.
This example makes a 5px wide border with a black color surrounding the body of an HTML webpage.

Example

Don't worry about the syntax you don't understand, for now, they will be explained to you in later chapters.

What You Should Know at the End of This Lesson

  • You should be able to define what HTML Styling is.
  • Change the colors of an HTML text and there sizes.
  • You should be able to explain briefly to someone else what this tutorial is all about.