How To Style An HTML Element?

  • Post category:HTML
  • Post author:
  • Post last modified:June 13, 2021
  • Reading time:2 mins read
You are currently viewing How To Style An HTML Element?

Styling Process

  • The first process is adds inline style using the style Attribute
  • Add style using the style Element in the head section of the document.
  • Add an external style sheet file.

Add Inline Style

You can add inline style-sheet using the style attribute.

<h1 style="color:red;"> Heading 1 </h1>
<p style="color:green;"> paragraph 1 </p>

Add Internal stylesheet

You can add internal style-sheet by using the style Element under the head Element

<!DOCTYPE html>
<html>
<head>
<title> page title </title>
<style>
h1{
   color;red;
}
p{
  color;green;
}
</style>
</head>
<body>
<h1> Heading 1 </h1>
<p> paragraph 1 </p>
</body>
</html>

Add External Style

The third process is link an external style-sheet on your document head section.

<!DOCTYPE html>
<html>
<head>
<title> Page title </title>
<link href="style.css">
</head>
<body>
<h1> Heading 1</h1>
<p> Paragraph 1</p>
</body>
</html>

How To Create .css File

Just write your style-sheet and save it the .css format in the root folder.

Ashim Khatua

Professionally Web Developer since 2015, And also a Blogger. I am the founder of SiteCodings.com. I love to share my knowledge, which I earned the past few years. I want to share my knowledge with you through my Blog. Keep Reading.

This Post Has 2 Comments

  1. Rakesh Kumar

    Thank you for guiding me…
    Can you please tell me about How to Change Text Color of HTML Document?

    1. Ashim Khatua

      Use the color property under the style attribute on the body tag.

Leave a Reply