SlideShare a Scribd company logo
1 of 22
Using Cascading Style sheets  In Dreamweaver CS3 Methods for establishing Consistent House Style
Diagrammatic Representations of what they do. Consider updating loads of pages Both do a similar Job but Templates are easier to  set up and use and do not involve adapting any code. CSS  results in simpler and cleaner HTML code, which provides shorter browser loading times. Template or CSS Page 1 Page 2 Page 3
About Cascading Style Sheets Cascading Style Sheets (CSS) is a collection of formatting rules that control the appearance of content in a web page. Using CSS styles to format a page separates content from presentation. The content of your page—the HTML code—resides in the HTML file, and the CSS rules defining the presentation of the code reside in another file (an external style sheet) or in another part of the HTML document (usually the head section).  Separating content from presentation also results in simpler and cleaner HTML code, which provides shorter browser loading times, and simplifies navigation for people with accessibility issues (for example, those using screen readers).  CSS gives you great flexibility and control over the exact appearance of your page.
Cascading Style Sheets ,[object Object],[object Object],[object Object],[object Object]
Apply your formatting by using style sheets. Make sure these are in users’ folders before you start. ,[object Object],[object Object],[object Object],[object Object]
Style sheet one
Style sheet two
Style sheet three
Style sheet four
New Style Sheet
 
Replace td and th as h1 and h2
Change colour by clicking into each section and selecting background colour and then font-size and color for it.
 
 
 
 
Style sheet Applied
BasicStyleSheet Code body { font-family: Arial, Helvetica, sans-serif; background-color: #CCFFFF; } h1 { font-family: Arial, Helvetica, sans-serif; color: #0000FF; font-size: x-large; } h2 { font-family: Arial, Helvetica, sans-serif; color: #FFFF00; font-size: large; }
Another Style sheet Applied
AdvancedStyleSheet Code h1{color:red;font-family: Arial,Helvetioca, sans-serif;font-size: xx-large} h2{color:red;font-family: Arial,Helvetioca, sans-serif;font-size: x-large} a{text-decoration:none:font-style:italic-transform:lowercase} a:link(color:red;font-weight;bold} a:visited {color:blue} A:hover {color: green;text-transform:uppercase} a:active{color:green}
Create a More Advanced CSS sheet ,[object Object],[object Object]

More Related Content

What's hot

Introduction to css
Introduction to cssIntroduction to css
Introduction to css
eShikshak
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
Jafar Nesargi
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
Jafar Nesargi
 

What's hot (17)

CSS (Cascading Style Sheet)
CSS (Cascading Style Sheet)CSS (Cascading Style Sheet)
CSS (Cascading Style Sheet)
 
Session v(css)
Session v(css)Session v(css)
Session v(css)
 
Introduction of css
Introduction of cssIntroduction of css
Introduction of css
 
Css starting
Css startingCss starting
Css starting
 
Cascading Style Sheets - CSS - Tutorial
Cascading Style Sheets - CSS  -  TutorialCascading Style Sheets - CSS  -  Tutorial
Cascading Style Sheets - CSS - Tutorial
 
Print CSS
Print CSSPrint CSS
Print CSS
 
Introduction to css
Introduction to cssIntroduction to css
Introduction to css
 
Css inclusion
Css   inclusionCss   inclusion
Css inclusion
 
web development basics tables part2
web development basics tables part2web development basics tables part2
web development basics tables part2
 
N5 CSS
N5 CSSN5 CSS
N5 CSS
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
 
3 first code_in_html
3 first code_in_html3 first code_in_html
3 first code_in_html
 
4 html tags
4 html tags4 html tags
4 html tags
 
Electronic referencing for students
Electronic referencing for students Electronic referencing for students
Electronic referencing for students
 
CSS Basics - Stylesheets and Color
CSS Basics - Stylesheets and ColorCSS Basics - Stylesheets and Color
CSS Basics - Stylesheets and Color
 
Html styles
Html stylesHtml styles
Html styles
 

Viewers also liked

How To Make An Exploding Image Using Flash Version With Sound
How To Make An Exploding Image Using Flash Version  With SoundHow To Make An Exploding Image Using Flash Version  With Sound
How To Make An Exploding Image Using Flash Version With Sound
Sutinder Mann
 
How To Add Behaviours To Objects
How To Add Behaviours To ObjectsHow To Add Behaviours To Objects
How To Add Behaviours To Objects
Sutinder Mann
 
Hotspots – Click On Image
Hotspots – Click On ImageHotspots – Click On Image
Hotspots – Click On Image
Sutinder Mann
 
How To Get A Navigation Menu
How To Get A Navigation MenuHow To Get A Navigation Menu
How To Get A Navigation Menu
Sutinder Mann
 
How To Make An Exploding Image Using Flash
How To Make An Exploding Image Using FlashHow To Make An Exploding Image Using Flash
How To Make An Exploding Image Using Flash
Sutinder Mann
 
Dtp Basics And Design Rules Student Version
Dtp Basics And Design Rules  Student VersionDtp Basics And Design Rules  Student Version
Dtp Basics And Design Rules Student Version
Sutinder Mann
 
Image Editing Tools In Dreamweaver
Image Editing Tools In DreamweaverImage Editing Tools In Dreamweaver
Image Editing Tools In Dreamweaver
Sutinder Mann
 
Dtp Basics And Design Rules
Dtp Basics And Design RulesDtp Basics And Design Rules
Dtp Basics And Design Rules
Sutinder Mann
 
Cascading style sheet (css)]
Cascading style sheet (css)]Cascading style sheet (css)]
Cascading style sheet (css)]
9574395990
 
Dtp Using Publisher 2007
Dtp Using Publisher 2007Dtp Using Publisher 2007
Dtp Using Publisher 2007
Sutinder Mann
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
Marc Steel
 

Viewers also liked (20)

Floating
FloatingFloating
Floating
 
Creating Forms2
Creating Forms2Creating Forms2
Creating Forms2
 
Using Ap Div Tag
Using Ap Div TagUsing Ap Div Tag
Using Ap Div Tag
 
How To Make An Exploding Image Using Flash Version With Sound
How To Make An Exploding Image Using Flash Version  With SoundHow To Make An Exploding Image Using Flash Version  With Sound
How To Make An Exploding Image Using Flash Version With Sound
 
How To Add Behaviours To Objects
How To Add Behaviours To ObjectsHow To Add Behaviours To Objects
How To Add Behaviours To Objects
 
Hotspots – Click On Image
Hotspots – Click On ImageHotspots – Click On Image
Hotspots – Click On Image
 
Using Templates2
Using Templates2Using Templates2
Using Templates2
 
How To Get A Navigation Menu
How To Get A Navigation MenuHow To Get A Navigation Menu
How To Get A Navigation Menu
 
Optimising Graphics
Optimising GraphicsOptimising Graphics
Optimising Graphics
 
How To Make An Exploding Image Using Flash
How To Make An Exploding Image Using FlashHow To Make An Exploding Image Using Flash
How To Make An Exploding Image Using Flash
 
basics of css
basics of cssbasics of css
basics of css
 
Dtp Basics And Design Rules Student Version
Dtp Basics And Design Rules  Student VersionDtp Basics And Design Rules  Student Version
Dtp Basics And Design Rules Student Version
 
Image Editing Tools In Dreamweaver
Image Editing Tools In DreamweaverImage Editing Tools In Dreamweaver
Image Editing Tools In Dreamweaver
 
A quick guide to Css and java script
A quick guide to Css and  java scriptA quick guide to Css and  java script
A quick guide to Css and java script
 
Dtp Basics And Design Rules
Dtp Basics And Design RulesDtp Basics And Design Rules
Dtp Basics And Design Rules
 
Cascading style sheet (css)]
Cascading style sheet (css)]Cascading style sheet (css)]
Cascading style sheet (css)]
 
Css
CssCss
Css
 
Dtp Using Publisher 2007
Dtp Using Publisher 2007Dtp Using Publisher 2007
Dtp Using Publisher 2007
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
 
Css cascading style sheet
Css cascading style sheetCss cascading style sheet
Css cascading style sheet
 

Similar to Using Cascading Style Sheets2

This is css which compiled by alex that is impo
This is css which compiled by alex that is impoThis is css which compiled by alex that is impo
This is css which compiled by alex that is impo
AlebelAyalneh
 
Css introduction
Css introductionCss introduction
Css introduction
Sridhar P
 
Unit iii css and javascript 1
Unit iii css and javascript 1Unit iii css and javascript 1
Unit iii css and javascript 1
Jesus Obenita Jr.
 

Similar to Using Cascading Style Sheets2 (20)

This is css which compiled by alex that is impo
This is css which compiled by alex that is impoThis is css which compiled by alex that is impo
This is css which compiled by alex that is impo
 
Introduction to css
Introduction to cssIntroduction to css
Introduction to css
 
Lecture-6.pptx
Lecture-6.pptxLecture-6.pptx
Lecture-6.pptx
 
Cascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpCascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) help
 
Css
CssCss
Css
 
Css introduction
Css introductionCss introduction
Css introduction
 
CSS Training in Bangalore
CSS Training in BangaloreCSS Training in Bangalore
CSS Training in Bangalore
 
Advanced Web Programming Chapter 8
Advanced Web Programming Chapter 8Advanced Web Programming Chapter 8
Advanced Web Programming Chapter 8
 
Web technology Unit-II Part-C
Web technology Unit-II Part-CWeb technology Unit-II Part-C
Web technology Unit-II Part-C
 
Css training tutorial css3 & css4 essentials
Css training tutorial css3 & css4 essentialsCss training tutorial css3 & css4 essentials
Css training tutorial css3 & css4 essentials
 
Css
CssCss
Css
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
 
Chapter 3 - CSS.pdf
Chapter 3 - CSS.pdfChapter 3 - CSS.pdf
Chapter 3 - CSS.pdf
 
HTML to CSS Basics Exer 2.pptx
HTML to CSS Basics Exer 2.pptxHTML to CSS Basics Exer 2.pptx
HTML to CSS Basics Exer 2.pptx
 
Css 2010
Css 2010Css 2010
Css 2010
 
Css 2010
Css 2010Css 2010
Css 2010
 
Css Basics
Css BasicsCss Basics
Css Basics
 
lecture CSS 1-2_2022_2023.pptx
lecture CSS 1-2_2022_2023.pptxlecture CSS 1-2_2022_2023.pptx
lecture CSS 1-2_2022_2023.pptx
 
Unit iii css and javascript 1
Unit iii css and javascript 1Unit iii css and javascript 1
Unit iii css and javascript 1
 
Beginners css tutorial for web designers
Beginners css tutorial for web designersBeginners css tutorial for web designers
Beginners css tutorial for web designers
 

More from Sutinder Mann (6)

What Is A Font Style in Publisher 2007
What Is A Font Style in Publisher 2007What Is A Font Style in Publisher 2007
What Is A Font Style in Publisher 2007
 
How To Make An Exploding Image Using Flash
How To Make An Exploding Image Using FlashHow To Make An Exploding Image Using Flash
How To Make An Exploding Image Using Flash
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
 
How To Create A Video With Titles In Movie Maker And Then Convert To Flash M...
How To Create A Video With Titles In Movie Maker And Then  Convert To Flash M...How To Create A Video With Titles In Movie Maker And Then  Convert To Flash M...
How To Create A Video With Titles In Movie Maker And Then Convert To Flash M...
 
Video And Sound In Dreamweaver Cs3
Video And Sound  In Dreamweaver Cs3Video And Sound  In Dreamweaver Cs3
Video And Sound In Dreamweaver Cs3
 
How to use a Template in Dreamweaver CS3
How to use a Template in Dreamweaver CS3How to use a Template in Dreamweaver CS3
How to use a Template in Dreamweaver CS3
 

Recently uploaded

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 

Recently uploaded (20)

MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
HTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation StrategiesHTML Injection Attacks: Impact and Mitigation Strategies
HTML Injection Attacks: Impact and Mitigation Strategies
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 

Using Cascading Style Sheets2

  • 1. Using Cascading Style sheets In Dreamweaver CS3 Methods for establishing Consistent House Style
  • 2. Diagrammatic Representations of what they do. Consider updating loads of pages Both do a similar Job but Templates are easier to set up and use and do not involve adapting any code. CSS results in simpler and cleaner HTML code, which provides shorter browser loading times. Template or CSS Page 1 Page 2 Page 3
  • 3. About Cascading Style Sheets Cascading Style Sheets (CSS) is a collection of formatting rules that control the appearance of content in a web page. Using CSS styles to format a page separates content from presentation. The content of your page—the HTML code—resides in the HTML file, and the CSS rules defining the presentation of the code reside in another file (an external style sheet) or in another part of the HTML document (usually the head section). Separating content from presentation also results in simpler and cleaner HTML code, which provides shorter browser loading times, and simplifies navigation for people with accessibility issues (for example, those using screen readers). CSS gives you great flexibility and control over the exact appearance of your page.
  • 4.
  • 5.
  • 11.  
  • 12. Replace td and th as h1 and h2
  • 13. Change colour by clicking into each section and selecting background colour and then font-size and color for it.
  • 14.  
  • 15.  
  • 16.  
  • 17.  
  • 19. BasicStyleSheet Code body { font-family: Arial, Helvetica, sans-serif; background-color: #CCFFFF; } h1 { font-family: Arial, Helvetica, sans-serif; color: #0000FF; font-size: x-large; } h2 { font-family: Arial, Helvetica, sans-serif; color: #FFFF00; font-size: large; }
  • 21. AdvancedStyleSheet Code h1{color:red;font-family: Arial,Helvetioca, sans-serif;font-size: xx-large} h2{color:red;font-family: Arial,Helvetioca, sans-serif;font-size: x-large} a{text-decoration:none:font-style:italic-transform:lowercase} a:link(color:red;font-weight;bold} a:visited {color:blue} A:hover {color: green;text-transform:uppercase} a:active{color:green}
  • 22.