SlideShare uma empresa Scribd logo
1 de 111
Baixar para ler offline
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

Mais conteúdo relacionado

Mais procurados (20)

CSS ppt
CSS pptCSS ppt
CSS ppt
 
Flexbox
FlexboxFlexbox
Flexbox
 
CSS Lists and Tables
CSS Lists and TablesCSS Lists and Tables
CSS Lists and Tables
 
HTML/CSS/java Script/Jquery
HTML/CSS/java Script/JqueryHTML/CSS/java Script/Jquery
HTML/CSS/java Script/Jquery
 
Flexbox and Grid Layout
Flexbox and Grid LayoutFlexbox and Grid Layout
Flexbox and Grid Layout
 
Basic of HTML, CSS(StyleSheet), JavaScript(js), Bootstrap, JSON & AngularJS
Basic of HTML, CSS(StyleSheet), JavaScript(js), Bootstrap, JSON & AngularJSBasic of HTML, CSS(StyleSheet), JavaScript(js), Bootstrap, JSON & AngularJS
Basic of HTML, CSS(StyleSheet), JavaScript(js), Bootstrap, JSON & AngularJS
 
JavaScript - An Introduction
JavaScript - An IntroductionJavaScript - An Introduction
JavaScript - An Introduction
 
CSS3 Media Queries
CSS3 Media QueriesCSS3 Media Queries
CSS3 Media Queries
 
CSS for Beginners
CSS for BeginnersCSS for Beginners
CSS for Beginners
 
Basics of JavaScript
Basics of JavaScriptBasics of JavaScript
Basics of JavaScript
 
Presentation of bootstrap
Presentation of bootstrapPresentation of bootstrap
Presentation of bootstrap
 
CSS Basics
CSS BasicsCSS Basics
CSS Basics
 
Java script
Java scriptJava script
Java script
 
CSS Grid
CSS GridCSS Grid
CSS Grid
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to Javascript
 
CSS Basics
CSS BasicsCSS Basics
CSS Basics
 
Html forms
Html formsHtml forms
Html forms
 
Css
CssCss
Css
 
JavaScript & Dom Manipulation
JavaScript & Dom ManipulationJavaScript & Dom Manipulation
JavaScript & Dom Manipulation
 
CSS
CSSCSS
CSS
 

Semelhante a Advanced Cascading Style Sheets

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 Jqueryvaluebound
 
Shyam sunder Rajasthan Computer
Shyam sunder Rajasthan ComputerShyam sunder Rajasthan Computer
Shyam sunder Rajasthan Computershyamverma305
 
CSS Foundations, pt 1
CSS Foundations, pt 1CSS Foundations, pt 1
CSS Foundations, pt 1Shawn Calvert
 
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 2Erin M. Kidwell
 
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).pdfAAFREEN SHAIKH
 
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 Mistakessanjay2211
 
Css introduction
Css introductionCss introduction
Css introductionSridhar P
 
Css tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.comCss tutorial by viveksingh698@gmail.com
Css tutorial by viveksingh698@gmail.comvivek698
 

Semelhante a 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
 

Último

General views of Histopathology and step
General views of Histopathology and stepGeneral views of Histopathology and step
General views of Histopathology and stepobaje godwin sunday
 
How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17Celine George
 
Practical Research 1 Lesson 9 Scope and delimitation.pptx
Practical Research 1 Lesson 9 Scope and delimitation.pptxPractical Research 1 Lesson 9 Scope and delimitation.pptx
Practical Research 1 Lesson 9 Scope and delimitation.pptxKatherine Villaluna
 
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxKatherine Villaluna
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17Celine George
 
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptxSandy Millin
 
Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.EnglishCEIPdeSigeiro
 
HED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfHED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfMohonDas
 
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdf
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdfP4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdf
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdfYu Kanazawa / Osaka University
 
Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.raviapr7
 
How to Manage Cross-Selling in Odoo 17 Sales
How to Manage Cross-Selling in Odoo 17 SalesHow to Manage Cross-Selling in Odoo 17 Sales
How to Manage Cross-Selling in Odoo 17 SalesCeline George
 
Prescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxPrescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxraviapr7
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17Celine George
 
Diploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfDiploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfMohonDas
 
CapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapitolTechU
 
What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?TechSoup
 
How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17Celine George
 
Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphNetziValdelomar1
 
CAULIFLOWER BREEDING 1 Parmar pptx
CAULIFLOWER BREEDING 1 Parmar pptxCAULIFLOWER BREEDING 1 Parmar pptx
CAULIFLOWER BREEDING 1 Parmar pptxSaurabhParmar42
 

Último (20)

General views of Histopathology and step
General views of Histopathology and stepGeneral views of Histopathology and step
General views of Histopathology and step
 
How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17
 
Practical Research 1 Lesson 9 Scope and delimitation.pptx
Practical Research 1 Lesson 9 Scope and delimitation.pptxPractical Research 1 Lesson 9 Scope and delimitation.pptx
Practical Research 1 Lesson 9 Scope and delimitation.pptx
 
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17
 
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
 
Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.
 
HED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfHED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdf
 
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdf
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdfP4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdf
P4C x ELT = P4ELT: Its Theoretical Background (Kanazawa, 2024 March).pdf
 
Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.
 
How to Manage Cross-Selling in Odoo 17 Sales
How to Manage Cross-Selling in Odoo 17 SalesHow to Manage Cross-Selling in Odoo 17 Sales
How to Manage Cross-Selling in Odoo 17 Sales
 
Prelims of Kant get Marx 2.0: a general politics quiz
Prelims of Kant get Marx 2.0: a general politics quizPrelims of Kant get Marx 2.0: a general politics quiz
Prelims of Kant get Marx 2.0: a general politics quiz
 
Prescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxPrescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptx
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17
 
Diploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfDiploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdf
 
CapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptx
 
What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?
 
How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17
 
Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a Paragraph
 
CAULIFLOWER BREEDING 1 Parmar pptx
CAULIFLOWER BREEDING 1 Parmar pptxCAULIFLOWER BREEDING 1 Parmar pptx
CAULIFLOWER BREEDING 1 Parmar pptx
 

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.