SlideShare a Scribd company logo
4
Most read
C S S
Cascading Style Sheets
C S S
Cascading Style Sheets
Introduction
What is CSS?
CSS is an extension to basic HTML
that allows you to style
your web pages.
C S S
Cascading Style Sheets
Role of CSS
1. MULTIPLE style sheets can apply to the SAME Web page
2. SAME style sheets can apply to the MULTIPLE Web page
C S S
Cascading Style Sheets
How to use CSS?
There are 3 ways to use CSS
Internal Style SheetInline Style Sheet External Style Sheet
(inside the <head> tag)(inside HTML element)
C S S
Cascading Style Sheets
Rules in CSS
A CSS Style Sheet is basically a collection of rules,
describing how the browser should display HTML elements.
Each rule contains 2 parts:
1. A Selector, stating which element in the HTML a
rule applies to;
2. One or more Declarations, which describe how
these elements should be displayed
C S S
Cascading Style Sheets
Selector
For Example
{
font-family: Times, Georgia, serif;
font-size: 24px;
text-align: center;
}
h1
Declarations
Enclosed in curly brackets { }
Selector
C S S
Cascading Style Sheets
h1{
font-family: Times, Georgia, serif;
font-size: 24px;
text-align: center;
}
Declaration has also 2 Parts
Properties Values
Properties and values
separated with a colon
Each declaration separated
with a semi-colon
For Example
Declarations consist of 2 parts: a property and a value. Each declaration ends with
a semi-colon ( ; ). Properties and values are separated with a colon ( : )

More Related Content

What's hot (12)

PPTX
Styling text using css
Daniel Francis
 
PPTX
How To Add CSS The Correct Way.
Reema
 
PPTX
YL html
dilom1986
 
PPTX
Html Styles-CSS
ispkosova
 
PPT
Page Layout 2010
guest0f1e7f
 
PPT
css
sonam1602
 
PPTX
web development basics tables part2
Kalluri Vinay Reddy
 
PPT
Tips For Ms Word
louisekelly94
 
PPTX
9 pernos
Lyiizzii RoOdriiguez
 
PPT
Week3 css
Rowena LI
 
Styling text using css
Daniel Francis
 
How To Add CSS The Correct Way.
Reema
 
YL html
dilom1986
 
Html Styles-CSS
ispkosova
 
Page Layout 2010
guest0f1e7f
 
web development basics tables part2
Kalluri Vinay Reddy
 
Tips For Ms Word
louisekelly94
 
Week3 css
Rowena LI
 

Similar to Css presentation (20)

PPTX
CSS-ppt.pptx f df dff dfvdfv fdvfdfddf dfv df
drpreetiwctm
 
PPTX
it-150608145445-lva1-app6891Unit_3 .pptx
Shwetamaurya36
 
PPTX
Css mod1
VARSHAKUMARI49
 
PPT
CSS.ppt
MukulSingh293955
 
PPTX
chitra
sweet chitra
 
PPTX
Css and its types
Mansi Mahadik
 
PPTX
Cascading Style Sheet (CSS)
AakankshaR
 
PPTX
Introduction to CSS
Ameer Khan
 
PPTX
Cascading style sheets (CSS)
Harshita Yadav
 
PPTX
Introduction-to-CSS hihihihihihihih.pptx
princesingh27072012
 
PPTX
CSS_Tutorial beginners friendly and the base cores of css
AbrahamChe2
 
PPTX
Css
veena parihar
 
PPTX
Cascading Style Sheets(CSS).pptx by kj frm changa
Krupal8
 
PPTX
HTML to CSS Basics Exer 2.pptx
JJFajardo1
 
PDF
cashcading style sheet note for beginares
paldibya712
 
PPTX
Session v(css)
Shrijan Tiwari
 
PPTX
Upstate CSCI 450 WebDev Chapter 3
DanWooster1
 
PPSX
CSS tutorial
Shajed Talukder
 
PDF
CSS Introduction
Diliara Nasirova
 
CSS-ppt.pptx f df dff dfvdfv fdvfdfddf dfv df
drpreetiwctm
 
it-150608145445-lva1-app6891Unit_3 .pptx
Shwetamaurya36
 
Css mod1
VARSHAKUMARI49
 
chitra
sweet chitra
 
Css and its types
Mansi Mahadik
 
Cascading Style Sheet (CSS)
AakankshaR
 
Introduction to CSS
Ameer Khan
 
Cascading style sheets (CSS)
Harshita Yadav
 
Introduction-to-CSS hihihihihihihih.pptx
princesingh27072012
 
CSS_Tutorial beginners friendly and the base cores of css
AbrahamChe2
 
Cascading Style Sheets(CSS).pptx by kj frm changa
Krupal8
 
HTML to CSS Basics Exer 2.pptx
JJFajardo1
 
cashcading style sheet note for beginares
paldibya712
 
Session v(css)
Shrijan Tiwari
 
Upstate CSCI 450 WebDev Chapter 3
DanWooster1
 
CSS tutorial
Shajed Talukder
 
CSS Introduction
Diliara Nasirova
 
Ad

More from Webtech Learning (20)

PPTX
Benefits of Digital Marketing
Webtech Learning
 
PPTX
Digital Marketing Benefits
Webtech Learning
 
PPTX
Future Scope of Digital Marketing in India
Webtech Learning
 
PPTX
Css types internal, external and inline (1)
Webtech Learning
 
PPTX
Bootstrap webtech presentation - new
Webtech Learning
 
PPTX
Client side &amp; Server side Scripting
Webtech Learning
 
PPTX
Software testing & Quality Assurance
Webtech Learning
 
PPTX
Shadows Effects in CSS
Webtech Learning
 
PPTX
Bs Typography
Webtech Learning
 
PPTX
Bootstrap grids
Webtech Learning
 
PPTX
Html formatting
Webtech Learning
 
PPTX
Css box-sizing
Webtech Learning
 
PPTX
Css position
Webtech Learning
 
PPTX
Css margins
Webtech Learning
 
PPTX
Css box-model
Webtech Learning
 
PPTX
Css Display Property
Webtech Learning
 
PPTX
Html media
Webtech Learning
 
PPTX
Css floats
Webtech Learning
 
PPTX
Html5 semantics
Webtech Learning
 
PPTX
Css pseudo-classes
Webtech Learning
 
Benefits of Digital Marketing
Webtech Learning
 
Digital Marketing Benefits
Webtech Learning
 
Future Scope of Digital Marketing in India
Webtech Learning
 
Css types internal, external and inline (1)
Webtech Learning
 
Bootstrap webtech presentation - new
Webtech Learning
 
Client side &amp; Server side Scripting
Webtech Learning
 
Software testing & Quality Assurance
Webtech Learning
 
Shadows Effects in CSS
Webtech Learning
 
Bs Typography
Webtech Learning
 
Bootstrap grids
Webtech Learning
 
Html formatting
Webtech Learning
 
Css box-sizing
Webtech Learning
 
Css position
Webtech Learning
 
Css margins
Webtech Learning
 
Css box-model
Webtech Learning
 
Css Display Property
Webtech Learning
 
Html media
Webtech Learning
 
Css floats
Webtech Learning
 
Html5 semantics
Webtech Learning
 
Css pseudo-classes
Webtech Learning
 
Ad

Recently uploaded (20)

PPTX
Modern Living Room Design in Tokyo,Japan
Yantram Animation Studio Corporation
 
PPTX
assignmesmcnjjanckujeckusent2-summit1.pptx
DoanHoaiAnhDuongK18C
 
PDF
70% of Users Leave Unresponsive Sites – Is Yours Driving Them Away?
Virtual Employee Pvt. Ltd.
 
PPTX
Turbomachinery_Presentation.pptx....... introduction and basic
abhisheksabhigowda47
 
PDF
COLOUR IN INTERIOR DESIGN- KAVYA CHAWLA .pdf
KavyaChawla4
 
PDF
The power of storytelling in design.pdf
Zohaib421
 
PPTX
Pendant Lights, Types and their applications
agdisha2
 
PPTX
Ghibli Vibe Presentation Template by EaTemp.pptx
helenacastrodelima
 
PPTX
etab modelling and design of concrete elemnts
MohamedAttia601252
 
PPTX
BASIC PRACTICE POWER POINT PRESENTATION 1
rkbasumatary02
 
PPTX
www ecommerce web based architecture.pptx
revathi148366
 
PPTX
美国学位证(OSU毕业证书)俄亥俄州立大学毕业证书如何办理
Taqyea
 
PDF
HISTORY OF Ethiopia and Horn of African
dereab29
 
PPTX
Introduction_to_GD&T_Complete.pptx_growww
rajkumarsingh764766
 
PDF
ABS system PPT 2025 for used automatic backing system .pdf
altron1331
 
PDF
The Third Place revolution: Designing for community in a fragmented world
jgadsbypeet8321
 
PPTX
class 11-B Chemistry of black and white photography by Kshitiz Sajwan.pptx
opkaddusajwan
 
PPTX
BOILER STEAM bana M ntpc kahalgaon boiler .pptx
didikesaadi1108
 
PDF
LESSON LEARNING PLAN Subject: ICT – Computer Systems Servicing (CSS)
sachidanacabel
 
PPTX
原版加拿大亚岗昆学院毕业证(AC毕业证书)如何办理
Taqyea
 
Modern Living Room Design in Tokyo,Japan
Yantram Animation Studio Corporation
 
assignmesmcnjjanckujeckusent2-summit1.pptx
DoanHoaiAnhDuongK18C
 
70% of Users Leave Unresponsive Sites – Is Yours Driving Them Away?
Virtual Employee Pvt. Ltd.
 
Turbomachinery_Presentation.pptx....... introduction and basic
abhisheksabhigowda47
 
COLOUR IN INTERIOR DESIGN- KAVYA CHAWLA .pdf
KavyaChawla4
 
The power of storytelling in design.pdf
Zohaib421
 
Pendant Lights, Types and their applications
agdisha2
 
Ghibli Vibe Presentation Template by EaTemp.pptx
helenacastrodelima
 
etab modelling and design of concrete elemnts
MohamedAttia601252
 
BASIC PRACTICE POWER POINT PRESENTATION 1
rkbasumatary02
 
www ecommerce web based architecture.pptx
revathi148366
 
美国学位证(OSU毕业证书)俄亥俄州立大学毕业证书如何办理
Taqyea
 
HISTORY OF Ethiopia and Horn of African
dereab29
 
Introduction_to_GD&T_Complete.pptx_growww
rajkumarsingh764766
 
ABS system PPT 2025 for used automatic backing system .pdf
altron1331
 
The Third Place revolution: Designing for community in a fragmented world
jgadsbypeet8321
 
class 11-B Chemistry of black and white photography by Kshitiz Sajwan.pptx
opkaddusajwan
 
BOILER STEAM bana M ntpc kahalgaon boiler .pptx
didikesaadi1108
 
LESSON LEARNING PLAN Subject: ICT – Computer Systems Servicing (CSS)
sachidanacabel
 
原版加拿大亚岗昆学院毕业证(AC毕业证书)如何办理
Taqyea
 

Css presentation

  • 1. C S S Cascading Style Sheets
  • 2. C S S Cascading Style Sheets Introduction What is CSS? CSS is an extension to basic HTML that allows you to style your web pages.
  • 3. C S S Cascading Style Sheets Role of CSS 1. MULTIPLE style sheets can apply to the SAME Web page 2. SAME style sheets can apply to the MULTIPLE Web page
  • 4. C S S Cascading Style Sheets How to use CSS? There are 3 ways to use CSS Internal Style SheetInline Style Sheet External Style Sheet (inside the <head> tag)(inside HTML element)
  • 5. C S S Cascading Style Sheets Rules in CSS A CSS Style Sheet is basically a collection of rules, describing how the browser should display HTML elements. Each rule contains 2 parts: 1. A Selector, stating which element in the HTML a rule applies to; 2. One or more Declarations, which describe how these elements should be displayed
  • 6. C S S Cascading Style Sheets Selector For Example { font-family: Times, Georgia, serif; font-size: 24px; text-align: center; } h1 Declarations Enclosed in curly brackets { } Selector
  • 7. C S S Cascading Style Sheets h1{ font-family: Times, Georgia, serif; font-size: 24px; text-align: center; } Declaration has also 2 Parts Properties Values Properties and values separated with a colon Each declaration separated with a semi-colon For Example Declarations consist of 2 parts: a property and a value. Each declaration ends with a semi-colon ( ; ). Properties and values are separated with a colon ( : )