Implementation styles of CSS
In this blog post I am going to assess different implementation
styles for CSS which include Internal, External and inline style sheets.
CSS=
Cascading Style Sheets this is used for formatting and coding web sites
HTML is used for page layouts
HTML is used for page layouts
Inline
The CSS is attached to the HTML element
e.g.
<h1
style="color:blue; font-size:12px<h1 style ="color:red;">
One
of the advantages of using inline is that it is easier to scroll up in the
source, rather than change the whole source file also website's would
load much faster compared to if you’re using external CSS because it has Lower
HTTP requests which mean that Inline loads faster.
0ne
of the disadvantages of using inline is that Inline styles must be applied to
every element that you want it to be in also it is the most specific
in cascade which means that it can sometimes over ride things which
you didn't intend for.
Internal
Internal
styles are placed inside the <head> section
<head>
<style>
h1{
color:blue;
}
</style>
</head>
This
coding only allows for one heading to be edited at the time which means that a
new code will be needed for every new heading.
Advantage
-Internal
styles don’t need to be applied to every element like inline styles need to be.
- Internal style sheets allow you to test your website without breaking
pages apart.
Disadvantage
-Internal also
tends to Load slower compared to External and Inline.
External
The
CSS is used to link a file back to the HTML element
<head>
<link rel="stylesheet" href="style.css">
</head>
<link rel="stylesheet" href="style.css">
</head>
External
style sheet allows us to reuse styles as many times as we want this is done by
linking the external style sheer to other web pages styles only need to be used
once because they can then be copied. External style sheets are stored in a
different CSS file they can also be written in any text editor. External style
sheet are mostly use when there are multiple pages and you need there to be the
same style on each web page.
Advantages
-The files size of the page is reduced because the
text is in another document this will reduce the file size a lot.
- allows you to Control multiple documents at the
same time
Disadvantages
Extra download time is needed to import the style
sheet
Change an element is time consuming
The different types of implementation styles for CSS all
have different advantage and disadvantages. Depending on the website the user
wished to create and what the web site will contain they will have to choose
the implementation style that will best suit their type of website. If the user
is creating a complicated web site they would be best suited to use an External
style sheet because the CSS code is separate to the HTML which will keep the
code manageable and not confusing as they would be separate.
Reference
