CSS used to define how to display HTML elements and to solve a design problem on HTML. CSS is more powerful design and working like a HTML Attribute.
Snytax
selector { attribute : value ; attribute : value }
*Selector is a HTML element, HTML id or Style Class that you want to change style.
*Use : between Attribute and Value
*Use ; between each Attribute
*User /* css command */ to comment CSS
How to use CSS?
1. Inline Style (Using with tag, like HTML attribute)
Syntax <HTMLelement style="attribute : value ; attribute : value">
Example <div style="font-size: 30px; color: gray;"> ... <div>
2. Internal Style Sheet (Embedded like JavaScript)
Syntax Example
<style type="text/CSS"> <style type="text/CSS">
selector { div {
attribute : value font-size: 30px;
attribute : value color: red;
} }
</style> </style>
3. External Style Sheet (Link CSS file)
HTML Syntax <link rel="stylesheet" type="text/css" href="/stylesheetname.css"/>
HTML Example <link rel="stylesheet" type="text/css" href="/Style/MyStyle.css"/>
4. Import Style (Import CSS file and allowed add new style)
HTML Syntax
<style> <style>
@import url("/stylesheetname.css"); @import url("/MyStyle.css");
selector { div {
attribute : value background-color: black;
attribute : value color: white;
} }
</style> </style>
HTML Syntax <link rel="stylesheet" type="text/css" href="/stylesheetname.css"/>
HTML Example <link rel="stylesheet" type="text/css" href="/Style/MyStyle.css"/>
4. Import Style (Import CSS file and allowed add new style)
HTML Syntax
<style> <style>
@import url("/stylesheetname.css"); @import url("/MyStyle.css");
selector { div {
attribute : value background-color: black;
attribute : value color: white;
} }
</style> </style>
Next Chapter >> CSS : Selector
Reference : http://www.w3schools.com/
No comments:
Post a Comment