SlideShare ist ein Scribd-Unternehmen logo

Advanced Cascading Style Sheets

•Als PPT, PDF herunterladen•
•
F
fantasticdigitaltools

Advanced CSS by: Alexandra Vlachakis Sandy Creek High School, Fayette County Schools Slide Show correlates Georgia Deparment of Edcuation Career and Technology PATHWAY: Interactive Media COURSE: Advanced Web Design UNIT 6: BCS-AWD-6 Advanced CSS

Bildung
1 von 111
Advanced CSS by: Alexandra Vlachakis Sandy Creek High School, Fayette County Schools Content and Resources Used With Permission: Interact With Web Standards. Copyright 2010. Erin Anderson et. Al. W3 Schools. www.w3schools.com. 12-25-11.
Instructors Note: ,[object Object],[object Object],[object Object]
CSS Review
Selector Review ,[object Object],[object Object],*The selector is normally the HTML element you want to style
Selector Review ,[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object],Selector Review
Property & Value Review ,[object Object],*Properties are separated from their respective values by colons : * Pairs are separated from each other by semicolons ;
Declaration Review ,[object Object],*Each declaration consists of a property and a value.
Style Sheets Review ,[object Object],[object Object],[object Object],[object Object],[object Object]
Class Selectors Review ,[object Object],[object Object],[object Object],[object Object],[object Object]
id Selectors Review ,[object Object],[object Object],[object Object],[object Object],[object Object]
Class and id Selectors Review ,[object Object],# .
How well do you know CSS? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
End Review ,[object Object],[object Object]
Lesson 1: Alpha or Transparent Colors
[object Object],[object Object],[object Object],[object Object],[object Object],Lesson 1: Alpha or Transparent Colors
Lesson 1 Assignment Part 1 of 2: CSS Alpha Color HTML Page ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 1 Assignment Part 2 of 2: CSS Alpha Color Style Sheet ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 2: Block elements
Lesson 2: Block elements ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 2 Assignment: Div Tags & Block elements ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 3: CSS Positioning
Lesson 3: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 3: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
SPECIAL PAUSE FOR DOCTYPE! ,[object Object],[object Object],[object Object],[object Object],[object Object]
SPECIAL PAUSE FOR DOCTYPE! ,[object Object],[object Object],[object Object],[object Object],[object Object]
SPECIAL PAUSE FOR DOCTYPE! ,[object Object],[object Object]
Lesson 3: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 3: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://www.w3schools.com/Css/css_positioning.asp
Lesson 3: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://www.w3schools.com/Css/css_positioning.asp
Lesson 3 Assignment: CSS Positioning ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 4: Aligning Block Elements
Lesson 4: Aligning Block Elements ,[object Object],[object Object],[object Object],[object Object]
Lesson 4: Aligning Block Elements ,[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://www.w3schools.com/css/css_align.asp
Lesson 4: Aligning Block Elements ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://www.w3schools.com/css/css_align.asp
Lesson 4: Aligning Block Elements ,[object Object],[object Object],Source: http://www.w3schools.com/css/css_align.asp
Lesson 4: Aligning Block Elements ,[object Object],[object Object],[object Object],[object Object]
Lesson 4: Aligning Block Elements ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 4: Aligning Block Elements ,[object Object],[object Object]
Lesson 5: Float
Lesson 5: Float ,[object Object],[object Object],[object Object]
Lesson 5: How Elements Float ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_float.asp
Lesson 5: Float ,[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_float.asp
Lesson 5: Float ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_float.asp
Lesson 5 Assignment: CSS Align and Float ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 6: Lists
Lesson 6: Lists ,[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_list.asp
Lesson 6: Lists ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_list.asp
Lesson 6: Different List Item Markers ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Source: http://w3schools.com/css/css_list.asp
Lesson 6 Assignment: CSS Lists Unordered ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 6 Assignment: CSS Lists Ordered ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 6: Lists Using Images ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],More list examples: http://w3schools.com/css/tryit.asp?filename= trycss_list-style-type_all
Lesson 6 Assignment: CSS Lists With An Image ,[object Object],[object Object],[object Object],[object Object]
Lesson 7: Fonts & Text On Web Pages
Lesson 7: Points are For Print ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Setting Font Size ,[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],Lesson 7: Setting Font Size
[object Object],[object Object],[object Object],[object Object],Lesson 7: Setting Font Size
Lesson 7: Setting Font Size with Pixels ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Browser Compatibility: This example allows Firefox, Chrome, and Safari to resize the text, but not Internet Explorer . The text can be resized in all browsers using the zoom tool (however, this resizes the entire page, not just the text).
Lesson 7: Setting Font Size with Em ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Setting Font Size with Em ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Font Style ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: CSS Font Families ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: CSS Font Families ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Font Bold ,[object Object],[object Object],[object Object],[object Object]
Lesson 7: Setting all the Styles in one line for FONT ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Text Color ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Text Alignment ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Text Decoration ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Text Transformation ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 7: Text Indentation ,[object Object],[object Object],[object Object]
Lesson 7 Assignment: CSS Fonts & Text ,[object Object],[object Object]
Lesson 8: CSS Tables
Lesson 8: HTML Tables Review ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 8: HTML Tables Review ,[object Object],[object Object]
Lesson 8: CSS Table Borders ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 8: Table Width and Height ,[object Object],[object Object],[object Object],[object Object]
Lesson 8: Table Text Alignment ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 8: Table Padding ,[object Object],[object Object],[object Object]
Lesson 8: Table Color ,[object Object],[object Object],[object Object]
Lesson 8 Assignment: CSS Table ,[object Object],[object Object]
Lesson 9: White Space & Borders
Lesson 9: White Space ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Borders ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Border-style values: ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Border Width ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Border Color ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Border - Individual sides ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: Border - Shorthand property ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Margins ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Margins ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Margins ,[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Margins ,[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Padding ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Padding ,[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Padding ,[object Object],[object Object],[object Object]
Lesson 9: White Space - Padding ,[object Object],[object Object],[object Object],[object Object]
Lesson 9: White Space - Padding ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 9 Assignment: CSS White Space ,[object Object],[object Object]
Lesson 10: Navigation Menus
Lesson 10: Navigation Menus ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 10: Navigation Menus ,[object Object],[object Object],[object Object]
Lesson 10: Navigation Menus ,[object Object],[object Object],[object Object]
Lesson 10: Vertical Navigation Menus ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 10: Horizontal Navigation Menus ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 10: Navigation Menus Floating List Items ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Lesson 10 Assignment: CSS Navigation Menus ,[object Object],[object Object]
Culminating Unit Performance Task ,[object Object]
Optional Lesson 11: CSS 3
CSS 3 ,[object Object],[object Object]
CSS3 Example ,[object Object],[object Object],CSS3 Reference table: http://w3schools.com/css3/css3_reference.asp

Empfohlen

Introduction to HTML and CSS
Introduction to HTML and CSSIntroduction to HTML and CSS
Introduction to HTML and CSS
Mario Hernandez
 
Css ppt
Css pptCss ppt
Css ppt
Nidhi mishra
 
How Cascading Style Sheets (CSS) Works
How Cascading Style Sheets (CSS) WorksHow Cascading Style Sheets (CSS) Works
How Cascading Style Sheets (CSS) Works
Amit Tyagi
 
html-css
html-csshtml-css
html-css
Dhirendra Chauhan
 
Css Ppt
Css PptCss Ppt
Css Ppt
Hema Prasanth
 
CSS
CSSCSS
CSS
Vladimir Zhidal
 
Html5 and-css3-overview
Html5 and-css3-overviewHtml5 and-css3-overview
Html5 and-css3-overview
Jacob Nelson
 
Cascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpCascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) help
casestudyhelp
 

Empfohlen

Introduction to HTML and CSS
Introduction to HTML and CSSIntroduction to HTML and CSS
Introduction to HTML and CSS
Mario Hernandez
 
Css ppt
Css pptCss ppt
Css ppt
Nidhi mishra
 
How Cascading Style Sheets (CSS) Works
How Cascading Style Sheets (CSS) WorksHow Cascading Style Sheets (CSS) Works
How Cascading Style Sheets (CSS) Works
Amit Tyagi
 
html-css
html-csshtml-css
html-css
Dhirendra Chauhan
 
Css Ppt
Css PptCss Ppt
Css Ppt
Hema Prasanth
 
CSS
CSSCSS
CSS
Vladimir Zhidal
 
Html5 and-css3-overview
Html5 and-css3-overviewHtml5 and-css3-overview
Html5 and-css3-overview
Jacob Nelson
 
Cascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpCascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) help
casestudyhelp
 
Html coding
Html codingHtml coding
Html coding
Briana VanBuskirk
 
Css
CssCss
Css
Hemant Saini
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Ajay Khatri
 
1 03 - CSS Introduction
1 03 - CSS Introduction1 03 - CSS Introduction
1 03 - CSS Introduction
apnwebdev
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
Shawn Calvert
 
Css Basics
Css BasicsCss Basics
Css Basics
Jay Patel
 
(Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS (Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS
Dave Kelly
 
Complete Lecture on Css presentation
Complete Lecture on Css presentation Complete Lecture on Css presentation
Complete Lecture on Css presentation
Salman Memon
 
Basic-CSS-tutorial
Basic-CSS-tutorialBasic-CSS-tutorial
Basic-CSS-tutorial
tutorialsruby
 
HTML CSS & Javascript
HTML CSS & JavascriptHTML CSS & Javascript
HTML CSS & Javascript
David Lindkvist
 
Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)
Chris Poteet
 
CSS3 2D/3D transform
CSS3 2D/3D transformCSS3 2D/3D transform
CSS3 2D/3D transform
Kenny Lee
 
Bootstrap
BootstrapBootstrap
Bootstrap
AvinashChunduri2
 
Java script
Java scriptJava script
Java script
Abhishek Kesharwani
 
CSS Font & Text style
CSS Font & Text style CSS Font & Text style
CSS Font & Text style
Yaowaluck Promdee
 
HTML Fundamentals
HTML FundamentalsHTML Fundamentals
HTML Fundamentals
BG Java EE Course
 
Html5 tutorial for beginners
Html5 tutorial for beginnersHtml5 tutorial for beginners
Html5 tutorial for beginners
Singsys Pte Ltd
 
CSS for Beginners
CSS for BeginnersCSS for Beginners
CSS for Beginners
Amit Kumar Singh
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
NextGenr
 
CSS
CSSCSS
CSS
venkatachalam84
 
Rational HATS and CSS
Rational HATS and CSSRational HATS and CSS
Rational HATS and CSS
Strongback Consulting
 
Week3 css
Week3 cssWeek3 css
Week3 css
Rowena LI
 

Weitere ähnliche Inhalte

Was ist angesagt?

1 03 - CSS Introduction
1 03 - CSS Introduction1 03 - CSS Introduction
1 03 - CSS Introduction
apnwebdev
 
CSS3 2D/3D transform
CSS3 2D/3D transformCSS3 2D/3D transform
CSS3 2D/3D transform
Kenny Lee
 

Was ist angesagt? (20)

Html coding
Html codingHtml coding
Html coding
 
Css
CssCss
Css
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
1 03 - CSS Introduction
1 03 - CSS Introduction1 03 - CSS Introduction
1 03 - CSS Introduction
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
 
Css Basics
Css BasicsCss Basics
Css Basics
 
(Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS (Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS
 
Complete Lecture on Css presentation
Complete Lecture on Css presentation Complete Lecture on Css presentation
Complete Lecture on Css presentation
 
Basic-CSS-tutorial
Basic-CSS-tutorialBasic-CSS-tutorial
Basic-CSS-tutorial
 
HTML CSS & Javascript
HTML CSS & JavascriptHTML CSS & Javascript
HTML CSS & Javascript
 
Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)
 
CSS3 2D/3D transform
CSS3 2D/3D transformCSS3 2D/3D transform
CSS3 2D/3D transform
 
Bootstrap
BootstrapBootstrap
Bootstrap
 
Java script
Java scriptJava script
Java script
 
CSS Font & Text style
CSS Font & Text style CSS Font & Text style
CSS Font & Text style
 
HTML Fundamentals
HTML FundamentalsHTML Fundamentals
HTML Fundamentals
 
Html5 tutorial for beginners
Html5 tutorial for beginnersHtml5 tutorial for beginners
Html5 tutorial for beginners
 
CSS for Beginners
CSS for BeginnersCSS for Beginners
CSS for Beginners
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
 
CSS
CSSCSS
CSS
 

Ähnlich wie Advanced Cascading Style Sheets

Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
Girl Develop It Cincinnati: Intro to HTML/CSS Class 2Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
Erin M. Kidwell
 
Basics Of Css And Some Common Mistakes
Basics Of Css And Some Common MistakesBasics Of Css And Some Common Mistakes
Basics Of Css And Some Common Mistakes
sanjay2211
 
Css introduction
Css introductionCss introduction
Css introduction
Sridhar P
 
Css tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.comCss tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.com
vivek698
 

Ähnlich wie Advanced Cascading Style Sheets (20)

Rational HATS and CSS
Rational HATS and CSSRational HATS and CSS
Rational HATS and CSS
 
Week3 css
Week3 cssWeek3 css
Week3 css
 
Csstutorial
CsstutorialCsstutorial
Csstutorial
 
CSS
CSSCSS
CSS
 
Introduction to css
Introduction to cssIntroduction to css
Introduction to css
 
Introduction to Html5, css, Javascript and Jquery
Introduction to Html5, css, Javascript and JqueryIntroduction to Html5, css, Javascript and Jquery
Introduction to Html5, css, Javascript and Jquery
 
Shyam sunder Rajasthan Computer
Shyam sunder Rajasthan ComputerShyam sunder Rajasthan Computer
Shyam sunder Rajasthan Computer
 
CSS Foundations, pt 1
CSS Foundations, pt 1CSS Foundations, pt 1
CSS Foundations, pt 1
 
Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
Girl Develop It Cincinnati: Intro to HTML/CSS Class 2Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
Girl Develop It Cincinnati: Intro to HTML/CSS Class 2
 
Introduction to CSS
Introduction to CSSIntroduction to CSS
Introduction to CSS
 
Css tutorial
Css tutorialCss tutorial
Css tutorial
 
Css - Tutorial
Css - TutorialCss - Tutorial
Css - Tutorial
 
1. Advanced Web Designing (12th IT) (1).pdf
1. Advanced Web Designing (12th IT) (1).pdf1. Advanced Web Designing (12th IT) (1).pdf
1. Advanced Web Designing (12th IT) (1).pdf
 
Css
CssCss
Css
 
Basics Of Css And Some Common Mistakes
Basics Of Css And Some Common MistakesBasics Of Css And Some Common Mistakes
Basics Of Css And Some Common Mistakes
 
Unit 2.1
Unit 2.1Unit 2.1
Unit 2.1
 
Css introduction
Css introductionCss introduction
Css introduction
 
INTRODUCTIONS OF CSS
INTRODUCTIONS OF CSSINTRODUCTIONS OF CSS
INTRODUCTIONS OF CSS
 
Lecture-6.pptx
Lecture-6.pptxLecture-6.pptx
Lecture-6.pptx
 
Css tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.comCss tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.com
 

Kürzlich hochgeladen

Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Sapana Sha
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
PECB
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
SoniaTolstoy
 

Kürzlich hochgeladen (20)

Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SD
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdf
 
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptxINDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
 
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationInteractive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
 
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
 
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
 
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
BAG TECHNIQUE Bag technique-a tool making use of public health bag through wh...
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 

Advanced Cascading Style Sheets

  • 1. Advanced CSS by: Alexandra Vlachakis Sandy Creek High School, Fayette County Schools Content and Resources Used With Permission: Interact With Web Standards. Copyright 2010. Erin Anderson et. Al. W3 Schools. www.w3schools.com. 12-25-11.
  • 2.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15. Lesson 1: Alpha or Transparent Colors
  • 16.
  • 17.
  • 18.
  • 19. Lesson 2: Block elements
  • 20.
  • 21.
  • 22. Lesson 3: CSS Positioning
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32. Lesson 4: Aligning Block Elements
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40. Lesson 5: Float
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46. Lesson 6: Lists
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54. Lesson 7: Fonts & Text On Web Pages
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73. Lesson 8: CSS Tables
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 79.
  • 80.
  • 81.
  • 82. Lesson 9: White Space & Borders
  • 83.
  • 84.
  • 85.
  • 86.
  • 87.
  • 88.
  • 89.
  • 90.
  • 91.
  • 92.
  • 93.
  • 94.
  • 95.
  • 96.
  • 97.
  • 98.
  • 99.
  • 100. Lesson 10: Navigation Menus
  • 101.
  • 102.
  • 103.
  • 104.
  • 105.
  • 106.
  • 107.
  • 108.
  • 110.
  • 111.