Scribd
Upload
18 views

Css

" ΝΑΙΝΑ " Naina.. jo saanjhe khwab dekhte the Naina.. bichad ke aaj ro diye hain yun Naina.. jo milke raat jaagte the Naina.. sehar mein palken meechte hain yun Juda huye kadam Jinhone li thi ye kasam Milke chalenge hardum Ab baant'te hain ye gham Bheege naina.. jo khidkeeyon se jhankte the Naina.. ghutan mein band ho gaye hai yun Saans hairaan hai Mann pareshaan hai Ho rahi si kyun ruaansa ye meri jaan hai Kyun nirasha se hai Aas haari huyi Kyun sawaalon ka utha sa Dil mein toofaan hai Naina..

Uploaded by

onlinekushti
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
18 views

Css

" ΝΑΙΝΑ " Naina.. jo saanjhe khwab dekhte the Naina.. bichad ke aaj ro diye hain yun Naina.. jo milke raat jaagte the Naina.. sehar mein palken meechte hain yun Juda huye kadam Jinhone li thi ye kasam Milke chalenge hardum Ab baant'te hain ye gham Bheege naina.. jo khidkeeyon se jhankte the Naina.. ghutan mein band ho gaye hai yun Saans hairaan hai Mann pareshaan hai Ho rahi si kyun ruaansa ye meri jaan hai Kyun nirasha se hai Aas haari huyi Kyun sawaalon ka utha sa Dil mein toofaan hai Naina..

Uploaded by

onlinekushti
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

What is 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
 External stylesheets are stored in CSS files

Example
<html>
<head>
<style>
body
{
background-color: lightblue;
}
h1
{
color: white;
text-align: center;
}
p
{
font-family: verdana;
font-size: 20px;
}
</style>
</head>
<body>
<h1>My First CSS Example</h1>
<p>This is a paragraph.</p>
</body>
</html>

CSS Syntax

The selector points to the HTML element you want to style.


The declaration block contains one or more declarations separated by semicolons.
Each declaration includes a CSS property name and a value, separated by a colon.
Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded by curly braces.
Type of Selector

The CSS id Selector

The id selector uses the id attribute of an HTML element to select a specific element.
The id of an element is unique within a page, so the id selector is used to select one unique element!
To select an element with a specific id, write a hash (#) character, followed by the id of the element.
Example
<html>
<head>
<style>
#para1
{
text-align: center;
color: red;
}
</style>
</head>
<body>
<p id="para1">Hello World!</p>
<p>This paragraph is not affected by the style.</p>
</body>
</html>

The CSS class Selector


The class selector selects HTML elements with a specific class attribute.
To select elements with a specific class, write a period (.) character, followed by the class name.
Example
<html>
<head>
<style>
.center
{
text-align: center;
color: red;
}
</style>
</head>
<body>
<h1 class="center">Red and center-aligned heading</h1>
<p class="center">Red and center-aligned paragraph.</p>
</body>
</html>

The CSS element Selector


The element selector selects HTML elements based on the element name.
Example
<html>
<head>
<style>
p
{
text-align: center;
color: red;
}
</style>
</head>
<body>
<p>Every paragraph will be affected by the style.</p>
<p id="para1">Me too!</p>
<p>And me!</p>
</body>
</html>

Three Ways to Insert CSS


There are three ways of inserting a style sheet:
 External CSS
 Internal CSS
 Inline CSS

External CSS
With an external style sheet, you can change the look of an entire website by changing just one file!
Each HTML page must include a reference to the external style sheet file inside the <link> element, inside the head
section.
Example
<html>
<head>
<link rel="stylesheet" href="mystyle.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Internal CSS
An internal style sheet may be used if one single HTML page has a unique style.
The internal style is defined inside the <style> element, inside the head section.
<html>
<head>
<style>
body
{
background-color: linen;
}
h1
{
color: maroon;
margin-left: 40px;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Inline CSS
An inline style may be used to apply a unique style for a single element.
To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.

Example
<html>
<body>
<h1 style="color:blue;text-align:center;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
</body>
</html>

You might also like