Html Style

How to set style to an HTML element?

Explanation

In HTML the style attribute is used to set styles for the HTML content pages. Some basic styles are as follows:
The HTML Style Attribute:

Setting the style of an HTML element, can be done with the style attribute. The HTML style attribute has the following syntax:
style="property:value;"
The property is a CSS property. The value is a CSS value.
Styling can be added to HTML elements in 3 ways: Inline, Internal and External

  • Inline - a style attribute is used in HTML elements

  • Internal - a <style> element is used in the HTML <head> section

  • External - using one or more external files called the css files

An external style sheet is used to define the style for many pages by just changing one css file. An external style sheet can be written in any text editor, without any html tags and saved with a .css extension.

HTML Background Color:

The "background-color" property defines the background color for an HTML element.
The below example sets the background of the page to pink color.
Example :

<body style="background-color:pink;">
<h1>This is a heading</h1>
</body>

HTML Text Color:


The color property defines the text color for an HTML element.
Example :

<p style="color:red;">This will change the paragraph content to red color.</p>

Result :

This will change the paragraph content to red color.


In the above example, the style property sets the paragraph content color to red.
HTML Text Alignment:

text-align:value;


The text-align property defines the horizontal text alignment for an HTML element. It includes values like left, right and center.
Example :

<h3 style="text-align:center;">Heading with center alignment</h3>

Result :

Heading with center alignment


In the above example the <h3> tag aligns the contents to the center.
To know more about styles refer : https://www.hscripts.com/tutorials/css/index.php

Ask Questions

Ask Question