There are three different types of CSS Styles
Internal CSS
Internal or embedded CSS requires you to add <style> tag in
the <head> section of your HTML document.
Advantage of internal CSS
You don't need to create and upload a separate document as in
the external style.
You can add reusable CSS classes.
Disadvantages
Hard to maintain CSS code from all pages
Code sample,
<!DOCTYPE html >
<html >
<head >
<style >
H2 {
Font-size:14px;
padding: 5px;
}
</style >
</head >
<body >
External CSS
With external CSS, you will link your web pages to an external
.css file, which can be created by any text editor in your device.
<link rel="stylesheet" type="text/css" href="site.css" / >
Advantages
Clean
code and easy for maintenance
Disadvantages
Your
pages may not be rendered correctly until the external CSS is loaded.
Uploading
or linking to multiple CSS files can increase your site’s download time.
Inline CSS
Inline CSS is used to style a specific HTML element. For this CSS
style, you’ll only need to add the style attribute to each HTML tag, without
using selectors.
<p style="text-align:left;"> left aside text .</p>
Advantages
You
can easily and quickly insert CSS rules to an HTML page
You
don’t need to create and upload a separate document as in the external style.
Disadvantages
Adding
CSS rules to every HTML element is time-consuming and makes your HTML structure
messy.
html element's padding area is the space between its
content and its border.
The padding is a shorthand for following properties, and follow
following sequence
1. padding-top
2. padding-right
3. padding-bottom
4. padding-left

Code example with all four values
. menu {
padding: 5px -5px 10px -0px;
}
The CSS padding-top property sets the top padding
of an element.
Padding top example
.about-content {
padding-top: 10px;
}
The CSS padding-bottom
property sets the bottom padding of an element.
Padding bottom example
.footer-content {
padding-bottom: -5px;
}
The CSS padding-right property sets the right padding of an element.
Padding right example
.left-menu{
padding-right:2em;
}
The CSS padding-left property sets the left padding of an element.
Padding left example
.right-content{
padding-left:2%;
}
The border-width property
The border-width property sets the width of an element's
four borders.
border width property values,
border-width: medium|thin|thick|length|initial|inherit;
Code example
div.dashboard {
border-width: medium;
}
The border-color property
The border-color property sets the color of an element's
four borders.
Code example
div.dashboard {
border-width: medium;
border-color:gray;
}