Styles in HTML
Styles in HTML:
With the help of style, you can add as many features to the tag as you can. It is just like as much as you can add sugar tea becomes sweeter. You can append styles like font, color, etc in the HTML tag.
Syntax for html style attributes-
<tagname style=”property:value;”>
The both property and value also used same as in CSS .
Few examples of style attributes:
1. Background color
Example:
<body>
<h1 style="background-color:blue;">Hello everyone</h1>
<h2 style="background-color:red;">hello women.</h2>
</body>
Hello everyone
hello women.
2. Text color
Example:
<h1 style="color:blue;">Hello everyone</h1>
<h2 style="color:red;">hello guyz.</h2>
Hello everyone
hello guyz.
3. Fonts
Example:
<p style="font-family:verdana;">Hello everyone</p>
<p style="font-family:courier;">Hello guyz.</p>Hello everyone
Hello guyz.
4. Text size
Example:
<h6 style="font-size:30%;">hello everyone</h6>
<pre style="font-size:16%;">hello guyz.</pre>hello everyone
hello guyz.
5. Text alignment
Example:
<h3 style="text-align:center;">This heading is at left</h3>
<p style="text-align:center;">This paragraph is at center.</p>
<p style="text-align:right;">This paragraph is at right.</p>
<div style="text-align:justify;">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.</div>
This heading is at left
This paragraph is at center.
This paragraph is at right.
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don’t look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn’t anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.
See the Pen Styles in HTML by Jehal Desai (@my-dreamzlive) on CodePen.