HTML Tutorial
HTML - Introduction HTML - Basic HTML - Structure HTML - Element HTML - Attributes HTML - Headings HTML - Paragraphs HTML - Styles HTML - Formatting HTML - Phrase Tags HTML - Quotations HTML - Comments HTML - Colors HTML - CSS HTML - Links HTML - Images HTML - Tables HTML - List HTML - Inline elements HTML - Block elements HTML - Classes HTML - Id HTML - Javascript HTML - File Path HTML - Iframe HTML - Responsive HTML - Computer Code HTML - Head tag HTML - Events HTML - Url Encoding HTML - Entities HTML - Validation
HTML Forms
HTML - Forms HTML - Form Elements HTML - Input types HTML - Input Attributes
HTML5 - Introduction HTML5 - New Elements HTML5 - Semantics HTML5 - Style Guide
HTML Media
HTML - Video HTML - Audio HTML - Embed Multimedia
HTML Graphics
HTML - Canvas HTML - SVG
HTML - Geolocation HTML - Drag & drop HTML - Web Storage HTML - Web Workers
HTML References
HTML - Tag Reference HTML - Tag by Category HTML - Attributes HTML - Global Attributes HTML - Events HTML - Language Codes HTML - Country Codes HTML - URL Encoding HTTP Methods HTTP Status Codes <input> types

HTML Styles

HTML is quite limited when it comes to the presentation of document.

Style rules describe how documents are presented on the web browsers.

With CSS, it becomes easy to specify the colors used for the text and the backgrounds, the size and the style for the fonts, the amount of space between elements, adding border and outlines to the elements.

HTML Style Attribute

You can apply style rules directly to any HTML element using style attribute of the relevant tag.

The HTML style attribute has the following syntax:

<tagname style="property:value;">

The property is a CSS property and the value is a CSS value.

You will learn more about CSS later in this tutorial.

HTML Background Color

The CSS background-color property sets the background color of an element.

The example below demonstrates, how to set the background color of a web page.

Run code

HTML Text Color

The CSS color property sets the color for an element's text content.

Run code

HTML Text Size

The CSS font-size property specifies the size of the text for an HTML element.

Run code

HTML Fonts

The CSS font-family property specifies the font to be used for an HTML element.

Run code

HTML Text Alignment

The CSS text-align property sets the horizontal alignment of the inline content like text and images in its parent block element.

Run code

You can apply multiple style rules on an element as shown below:

Run code

Adding Borders to Elements

The CSS border property defines borders of an element.

Run code