All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML Style

Style attribute is used to change the apperance of HTML elements like text color,background color,font-size etc.

Cascading Style Sheets(CSS) is used to give styling to HTML elements you can apply plenty of different style attribute to HTML elements


Syntax: attributename:value;


There are three ways to apply styling:

  • External: Define style sheet rules in a separate .css file and then include that file in your HTML document using HTML <link> tag.
  • Internal:Define styles in the <head> tag inside <style> tag.
  • Inline:Define styles in starting tag of an element.

External Styling

style.css file

.para1
{
color:blue;
font-size:20px;
}

styledemo.html

<! DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<p class="para1">This is the example of External style</p>
</body>
</html>

Result of the above Example

This is the example of External style





Internal Styling

<! DOCTYPE html>
<html>
<head>
<style>
.para1
{
color:blue;
font-size:20px;
}
</style>
</head>
<body>
<p class="para1">This is the example of Internal style</p>
</body>
</html>

Result of the above Example

This is the example of Internal style





Inline Styling

<p class="para1" style="color:blue;font-size:20px;">This is the example of Inline style</p>

Result of the above Example

This is the example of Inline style



You will learn complete CSS in CSS Tutorials.


❮ PreviousNext ❯