CSS
-----
->CSS stands for Cascading Style Sheets
->CSS describes how HTML elements are to be displayed on screen, paper, or in other media
->CSS saves a lot of work. It can control the layout of multiple web pages all at once
Why CSS
-----------
->CSS is used to define styles for your web pages
->including the design, layout and variations in display for
->different devices and screen sizes.
CSS Syntax
---------------
-A CSS rule-set consists of a selector and a declaration block:
Syntax: Selector{declaration;.....;...}
Ex:
h1{color : blue; font-size:12px;}
Three ways to insert CSS
-------------------------------
1. External style sheet - link in the head section
2. Internal style sheet - in the head section
3. Inline style - inside as html elements
1. External Style sheet
------------------------------
Prg1 : mystyle.html
-----
<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
<h1>Welcome to CSS</h1>
</body>
</html>
------------------------------------
Prg2 : mystyle.css
-----
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
===============================================
2. Internal Style Sheet
-----------------------------
Prg1 : mystyle.html
-----
<html>
<head>
<style>
body {
background-color: lightblue;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
<body>
<h1>Welcome to CSS</h1>
</body>
</html>
====================================================
3. Inline Style Sheet
-------------------------
<html>
<head></head>
<body>
<h1 style="color:blue;margin-left:30px;">Welcome to CSS</h1>
</body>
</html>
--------------------------------------------------------------------
No comments:
Post a Comment