There are four ways to apply style to a Web page.
Inline CSS: HTML elements may have CSS applied to them via the STYLE attribute.For Example: If You have <p> element into webpage, you can apply inline style likeshows in example.
<p style=”font-size: 12px; color: #000000;”>Test </p>
Embedded CSS: CSS may be embedded in a Web page by placing the code in a STYLE element within the HEAD element.For Example: If You have <h2> element into webpage, you can apply embedded style like shows in example.
<head>
<style type=”text/css”>
h2 {
font-size: 16px;
color: #2d2d2d;
font-weight: 900;
}
</style>
</head>
Linked CSS: CSS can be placed in an external file (a simple text file containing CSS) and linked via the link element.You can apply style to webpage using external file as shown in example.
<link rel=”stylesheet” href=”custom/custom.css” type=”text/css” media=”screen, projection” />
Imported CSS: Another way to utilize external CSS files via @import.
<style>
@import url(‘/css/styles.css’);
</style>
Put then your “styles.css” document can contain calls to any number of additional style sheets:
@import url(‘/css/typography.css’);
@import url(‘/css/layout.css’);
@import url(‘/css/color.css’);
