CSS Basics
The basic need of the CSS are:-
1.Previous knowledge of HTML.
2.A Web browser to view your your web page.
3.A text editor ex notepad which come with windows . Sublime , Web Matrix, Dreamweaver are also text editor they are recommended because they have some built in codes, suggestions which are used regularly by coders. .
HTML was never intended to contain tags for formatting a document basically it is used for writing the content and to make content attractive we use CSS.
HTML was intended to define the content of a document, like:
<h1>Heading of the page</h1>
<p>This is a paragraph.</p>
When tags like <font>, and color attributes were added to the HTML 3.2 specification, it started a nightmare for web developers. Development of large web sites, where fonts and color information were added to every single page, became a long and expensive process.It takes lot of time and energy to do that
to solve this problem, the World Wide Web Consortium (W3C) created CSS.
In HTML 4.0, all formatting could be removed from the HTML document, and stored in a separate CSS file.
All browsers support CSS today.
to solve this problem, the World Wide Web Consortium (W3C) created CSS.
In HTML 4.0, all formatting could be removed from the HTML document, and stored in a separate CSS file.
All browsers support CSS today.
How CSS Is Used
CSS is used in three ways which are:-
- Inline CSS (styling is done in same line)
- Internal CSS|(styling is done on the same page)
- External CSS(styling is done in different page saved as .css extension)
Example of Inline CSS
<p style="font-weight : bold;"> This text will be bold</p>
this is an example of the Inline CSS.
Example of Internal CSS
To give you a proper understanding of Internal CSS I have to write the full HTML code .
<html>
<head>
<title>CSS Basics</title>
<style type="text/css">
div{
font-weight:bold;
}
span{
font-style: italic;
}
</style>
</head>
<body>
<div>This will show the use of the Internal CSS</div>
this will show the use of <span>Internal CSS</span>
</body>
</html>
External CSS
To use external CSS we have to make a file in which all code of CSS is written there.
Then this file should be saved with extension of .css.
Then we have to give reference to our .css file it should be done as
<rel="stylesheet"type="text/css href="name of the .css file>
This is done to connect HTML page with CSS page without it styling that we have done in our page will not change anything on the HTML page.