Introduction
There are three types of CSS styles, external style sheet, internal
style sheet and inline style. In this Report I will be describing the different
types of CSS styles, Examples of where it would be used and the advantages and disadvantages
of each CSS style.
Inline CSS:
Inline CSS is applied is applied to one element using the
style attribute
Example
<h1 style="color:blue;margin-left:30px;">This is a
heading.</h1>
Advantages
Testing: Loads of web designers use inline CSS
to test websites that they have just started on, It is also used to debug there
pages when there is a big problem with their website.
Smaller websites:
Incline CSS are great for blogs where there are a limited amount of pages and it
helps users and service providers.
Lower the HTTP
Requests: Because the website
gets lower HTTP Requests it means the website loads a lot faster.
Disadvantages
Every element: This
means to implement CSS it must be used every time you use a tag which takes up
a lot of maintenance time.
Internal CSS
An internal style sheet should be used when one document has
a unique style. You can do this at the head of a HTML page, inside the <style>
tag
Example
<head>
<style>
body {
background-color: linen;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
<style>
body {
background-color: linen;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
Advantages:
One style only:
Internal styles doesn’t need to be assigned to every element like inline
No additional
downloads: You don’t need to download anything extra to receive style
information.
Disadvantages
Multiple documents:
This can’t be used if you want multiple web pages.
Slow page loading:
Compared to inline and external CSS as there’s less HTTP request.
Large file size:
when using internal CSS the file sizes are large which is okay when the website
is offline but when the website goes online it will take a long time to load.
External CSS
An external style sheet is perfect when it applied to many pages.
You can also change the way the whole website look by changing a single file.
Each Page needs to have a <link> tag. This goes inside the head section.
Example
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
Advantages:
Reduced file
size: External CSS file size is
lesser compared to the two.
Less load time: External
CSS takes about 8 seconds to load.
You can control the feel and look of many documents which is
really helpful if you are working with a team of people to create a website.
It is much easier to reuse CSS code if you have separate fields.
You don’t need to type the same code on every webpage.
Using External CSS it makes your web pages highly readable
and to the best quality.
Disadvantages on
external CSS
Because downloading speed on CSS is fast it could slow down
the speed of your webpages. Also if you don’t have many styles. Your site can
become harder to maintain.
I appreciate the effort of the blogger. I have one small question which is related to html5. If you could help me out then it would be really helpful. How is the page structure in html5 is different from html4?
ReplyDeletehtml5 training in chennai|html5 course in chennai
Casino In Go - Guide and Facts for Gamblers
ReplyDeleteThe gambling laws in the USA 비윈티비 do not affect casinos. However, if they 룰렛 돌리기 are repealed, those 룰렛 이벤트 that were already in place that 토토 라이브 스코어 are in place 1xbet korea for gambling