css use in html code example

Example 1: how to link your css file to html

<head>
	<link rel='stylesheet' href='style.css'>
</head>

Example 2: adding css to html body

Three ways to add CSS to the body of html:
	1)External CSS
	2)Internal CSS
	3)Inline CSS

1) Externally:  
    Type your css code in a file. Remember you file name.
	Then,
<head>
	<link rel="stylesheet" type="text/css" href="FileName.css" >
</head>

2) Internally:
	Type your cSS in the html file itself. (It is not preffered until
	little CSS code is to be added). This can be done by style tag.
	Example:
	<head>
	<style>
	h1 {
      text-color:red;
      text-size: 0.8em;
    }
    </style>
	</head>

3) Inline:
	This method is not used by developers as it is very lengthy and
	maintaining code becomes difficult.
	Example:
   <h1 style="color:blue;text-align:center;">Header file</h1>

Example 3: CSS IN HTML

<!-- Styles can be inserted in html using <style></style> element -->
<style>
	body {
    	background-color: cyan/*Color*/; 
  	}
</style>

<!--CSS can also be linked using link tag in html 
-the link tag is a self-closing tag-->

<link rel="stylesheet" type="text/css" href="filename.css"/>

Example 4: css in html

<!-- EXAMPLE -->
<div class="your_class" style="display:none">

<!--[SYNTAX: style="<CSS-code>"] -->

Example 5: how to use css

<link rel="stylesheet" href="stylesheet.css">
<div class="mydiv"></div>
<style>
.mydiv {
background-color: /*Color*/;
color: /*Another color*/;
}
</style>

Example 6: how to css html

<html>
<head>
<style>
body{
	direction:rtl;
}
  </style>
  </head>
  <body>
  </body>
</html>

Tags:

Misc Example

Recent Posts