CSS Properties

CSS Colors, Fonts and Sizes:

Here, we will demonstrate some commonly used CSS properties. You will learn more about them later.

  1. CSS color         = property defines the text color to be used.
  2. CSS font-family   = property defines the font to be used.
  3.  CSS font-size    =property defines the text size to be used.
Example:-
<!DOCTYPE  html>
<html>
<head>
<style>
h1 {
color: blue;
font-family: verdana;
font-size: 300%;
}
{
color: red;
font-family: courier;
font-size: 160%;
}
</style>

</head>
<body><h1>This is a heading</h1>
<p>This is a paragraph.</p></body>
</html>

CSS Border:-

The CSS border property defines a border around an HTML element.

Example:-
p { border: 2px solid powderblue;}

CSS Padding:-

The CSS padding property defines a padding (space) between the text and the border.

Example:-

Use of CSS border and padding properties:

p { border: 2px solid Red;
padding: 30px;
}

CSS Margin:-

The CSS margin property defines a margin (space) outside the border.

Example:-

Use of CSS border and margin properties:

p {  border: 2px solid Red ;
margin: 50px;
}

Link to External CSS:-

External style sheets can be referenced with a full URL or with a path relative to the current web page.

Example:-

This example uses a full URL to link to a style sheet

<link rel=”stylesheet” href=”https://www.w3schools.com/html/styles.css”>
Example:-

This example links to a style sheet located in the html folder on the current web site:

<link rel=”stylesheet” href=”/html/styles.css”>
Example:-

This example links to a style sheet located in the same folder as the current page:

<link rel=”stylesheet” href=”styles.css”>

Leave a Reply