Introduction to css & its attributes with syntax

Cascading Style Sheet (CSS)
By
M.Priyadharshini
MCA

Introduction
 CSS – Cascading Style Sheet.
 It define how to display HTML elements.
 The term cascading derives from the fact that
multiple style sheets can be applied to the same Web
page.

We have 3 types of CSS
➢Inline style sheet
<H1 style="color: maroon">
➢Embeded style sheet
<style> </style>
➢External style sheet
<link href="style.css">
We type the code in notepad and save it in .html
format.

Inline style sheet:
We can write css properties directly at the tags by
using style attribute.
Inline style(inside an HTML element)
<p style="color:sienna;margin-
left:20px">This is a paragraph.</p>

Properties:
➔ Background-color: Used to change the bgcolor
of a text in a web page.
➔ Color: Used to apply Color to the text in a web
page.
➔ Text-align: Used to adjust the text in left, right,
centre of the page.
➔ Word-spacing: Used to give specified space in
b/w the words.
➔ Letter-spacing: Used to give specified space in
b/w the letters.(ex: 12px px means pixel).

Embeded style sheet. :
we write css properties at the head part by using
style attribute.
Embeded style sheet(in the head section)
<head>
< style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
< /style>
< /head>

properties
 url: it helps to bring the image to a web page by
giving its address or the image name with
format.(ex: bg.jpg) “background- image: url
(“nh.jpg”)
 Background-repeat: when we add an image
then it will be added in a x , y axis format , no-
repeat. So we have 4 types
 Background-color: to give color to the webpage.

External style sheet:
we write the css properties in another notepad and
save it with .css format.
We are calling this css file at the head part of the html
by using link tag.
External style sheet
<head>
< link rel="stylesheet" type="text/css"
href="mystyle.css">
< /head>

properties
●
Link: This is used to link the code in
different notepads.

CSS Styling CSS Box Model CSS Advanced
Styling
Backgrounds
Styling Text
Styling Fonts
Styling Links
Styling Lists
Styling Tables
CSS Box Model
CSS Border
CSS Outline
CSS Margin
CSS Padding
CSS Display
CSS Positioning
CSS Floating
CSS Align
CSS Tags Categories

Introduction to css & its attributes with syntax

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Destaque

Destaque (12)

Semelhante a Introduction to css & its attributes with syntax

Semelhante a Introduction to css & its attributes with syntax (20)

Mais de priyadharshini murugan

Mais de priyadharshini murugan (18)

Último

Último (20)

Introduction to css & its attributes with syntax