Internal CSS
Inline CSS is not good for website performance and code efficiency. The reason is that first our content and styling are mixed up with each other which is not very neat and clean and it’s difficult to maintain. Also, our styling is linked to a specific paragraph. so if I wish to change the styling of all paragraphs in the webpage, I will have to do it individually which is not very time efficient and is very confusing. So I would recommend not to use inline CSS unless it’s very important.
A better way is to use Internal CSS which we saw in example.com. To apply this go to the head section and between head tags insert the “style” tags and add the attribute “type”. Value is “text/css”
<head>
<style type="text/css">
</style>
</head>Now you can add CSS properties here in the style tag and all of these properties will be applied to the whole webpage.
The general rule to apply CSS properties is:
selector {
property1: value;
property2: value;
}To apply the style to all “p” tags in the document using this:
<style type=”text/css”>
p {
color:green;
font-size:150%;
}
h1 {
color:red;
}
</style>
Keep in mind, that putting a semi-colon after every CSS property is important or you will lose all of the CSS properties. Now we are going to see the last and most appropriate way to use CSS which is External CSS.
Instructor ~ TARUN KUMAR
