CSS 3 Ways To Style HTML

CSS 3 Ways To Style HTML
CSS 3 Ways To Style HTML
Before we get into learning CSS and seeing examples, we should know that there are three ways we can apply CSS styling to our HTML elements.
  1. Inline direct styling using the HTML "style" attribute of the element to apply CSS.
  2. Single document specific styling using the HTML <style> element.
  3. Whole site styling using an external cascading style sheet.
1. Inline CSS Styling HTML elements
CSS CODE EXAMPLE
<p style="color:#F00; font-size:18px;">
   I am a styled element
</p>
I am a styled element

2. Single document specific styling using the HTML <style> element
CSS CODE EXAMPLE
<html>
<head>
<style type="text/css">
.myStyle1{
  color:#F00;
  font-size:18px;
}
</style>
</head>
<body>
<p class="myStyle1">I am a styled element</p>
</body>
</html>
I am a styled element

3. Whole Site Styling using an external style sheetClick here to see Whole Site Styling using an external style sheet
I recommend using an external style sheet(#3) if your website happens to be robust or dynamically rendered.
 click here to code. 

0 Response to "CSS 3 Ways To Style HTML"

Post a Comment