Suche senden
Hochladen
Lesson 03
•
0 gefällt mir
•
294 views
Gene Babon
Folgen
Technologie
Melden
Teilen
Melden
Teilen
1 von 13
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
Lesson 03
Lesson 03
Gene Babon
Lesson 05
Lesson 05
Gene Babon
Wdes105 overview
Wdes105 overview
Gene Babon
Lesson 16
Lesson 16
Gene Babon
Lesson 18
Lesson 18
Gene Babon
Wdes105 day 1
Wdes105 day 1
Gene Babon
Lesson 08
Lesson 08
Gene Babon
Lesson 01
Lesson 01
Gene Babon
Weitere ähnliche Inhalte
Ähnlich wie Lesson 03
Fewd week2 slides
Fewd week2 slides
William Myers
Html week7 2019 2020 by eng.osama ghandour
Html week7 2019 2020 by eng.osama ghandour
Osama Ghandour Geris
Html week8 2019 2020 for g10 by eng.osama ghandour
Html week8 2019 2020 for g10 by eng.osama ghandour
Osama Ghandour Geris
From a Fireworks Comp to a Genesis Child Theme, Step by Step
From a Fireworks Comp to a Genesis Child Theme, Step by Step
East Bay WordPress Meetup
Lesson 12
Lesson 12
Gene Babon
HTML+CSS: how to get started
HTML+CSS: how to get started
Dimitris Tsironis
Writing your own WordPress themes and plugins
Writing your own WordPress themes and plugins
Stephanie Wells
Monster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applications
Laurence Svekis ✔
HTML and CSS.pptx
HTML and CSS.pptx
TripleRainbow
Take your display template skills to the next level
Take your display template skills to the next level
Elio Struyf
Back to Basics WordCamp Chicago 2011 TJList
Back to Basics WordCamp Chicago 2011 TJList
TJList
Сергей Больщиков "Protractor Tips & Tricks"
Сергей Больщиков "Protractor Tips & Tricks"
Fwdays
Javajam coffee house case study chapter 5 (basic of web design html .pdf
Javajam coffee house case study chapter 5 (basic of web design html .pdf
ezzi97
Building beautiful websites with bootstrap a case study (DevelopMentor webcast)
Building beautiful websites with bootstrap a case study (DevelopMentor webcast)
Michael Kennedy
Html:css crash course (4:5)
Html:css crash course (4:5)
Thinkful
Creational builder design_pattern
Creational builder design_pattern
bhaskara k
BITM3730 8-29.pptx
BITM3730 8-29.pptx
MattMarino13
BITM3730 8-29.pptx
BITM3730 8-29.pptx
MattMarino13
Cascading Style Sheets.docx
Cascading Style Sheets.docx
write31
Code & design your first website (3:16)
Code & design your first website (3:16)
Thinkful
Ähnlich wie Lesson 03
(20)
Fewd week2 slides
Fewd week2 slides
Html week7 2019 2020 by eng.osama ghandour
Html week7 2019 2020 by eng.osama ghandour
Html week8 2019 2020 for g10 by eng.osama ghandour
Html week8 2019 2020 for g10 by eng.osama ghandour
From a Fireworks Comp to a Genesis Child Theme, Step by Step
From a Fireworks Comp to a Genesis Child Theme, Step by Step
Lesson 12
Lesson 12
HTML+CSS: how to get started
HTML+CSS: how to get started
Writing your own WordPress themes and plugins
Writing your own WordPress themes and plugins
Monster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applications
HTML and CSS.pptx
HTML and CSS.pptx
Take your display template skills to the next level
Take your display template skills to the next level
Back to Basics WordCamp Chicago 2011 TJList
Back to Basics WordCamp Chicago 2011 TJList
Сергей Больщиков "Protractor Tips & Tricks"
Сергей Больщиков "Protractor Tips & Tricks"
Javajam coffee house case study chapter 5 (basic of web design html .pdf
Javajam coffee house case study chapter 5 (basic of web design html .pdf
Building beautiful websites with bootstrap a case study (DevelopMentor webcast)
Building beautiful websites with bootstrap a case study (DevelopMentor webcast)
Html:css crash course (4:5)
Html:css crash course (4:5)
Creational builder design_pattern
Creational builder design_pattern
BITM3730 8-29.pptx
BITM3730 8-29.pptx
BITM3730 8-29.pptx
BITM3730 8-29.pptx
Cascading Style Sheets.docx
Cascading Style Sheets.docx
Code & design your first website (3:16)
Code & design your first website (3:16)
Mehr von Gene Babon
Job Search | Tropical Depressions | Bowling Alleys
Job Search | Tropical Depressions | Bowling Alleys
Gene Babon
Tech Over Fifty Launch Meeting
Tech Over Fifty Launch Meeting
Gene Babon
Anatomy Virtual Self Study Group NEPHP 2018
Anatomy Virtual Self Study Group NEPHP 2018
Gene Babon
Become a Front End Web Developer
Become a Front End Web Developer
Gene Babon
Navigating a Career in Web Technology
Navigating a Career in Web Technology
Gene Babon
Info Session
Info Session
Gene Babon
Info session
Info session
Gene Babon
Getting Things Done
Getting Things Done
Gene Babon
jQuery Mobile Hour 4
jQuery Mobile Hour 4
Gene Babon
Lesson 17
Lesson 17
Gene Babon
Lesson 18
Lesson 18
Gene Babon
Lesson 17
Lesson 17
Gene Babon
Lesson 16
Lesson 16
Gene Babon
Lesson 15
Lesson 15
Gene Babon
Lesson 11
Lesson 11
Gene Babon
Lesson 10
Lesson 10
Gene Babon
Lesson 09
Lesson 09
Gene Babon
Lesson 04
Lesson 04
Gene Babon
Lesson 01
Lesson 01
Gene Babon
Lesson 17
Lesson 17
Gene Babon
Mehr von Gene Babon
(20)
Job Search | Tropical Depressions | Bowling Alleys
Job Search | Tropical Depressions | Bowling Alleys
Tech Over Fifty Launch Meeting
Tech Over Fifty Launch Meeting
Anatomy Virtual Self Study Group NEPHP 2018
Anatomy Virtual Self Study Group NEPHP 2018
Become a Front End Web Developer
Become a Front End Web Developer
Navigating a Career in Web Technology
Navigating a Career in Web Technology
Info Session
Info Session
Info session
Info session
Getting Things Done
Getting Things Done
jQuery Mobile Hour 4
jQuery Mobile Hour 4
Lesson 17
Lesson 17
Lesson 18
Lesson 18
Lesson 17
Lesson 17
Lesson 16
Lesson 16
Lesson 15
Lesson 15
Lesson 11
Lesson 11
Lesson 10
Lesson 10
Lesson 09
Lesson 09
Lesson 04
Lesson 04
Lesson 01
Lesson 01
Lesson 17
Lesson 17
Kürzlich hochgeladen
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
DianaGray10
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
Md Hossain Ali
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
Brian Pichman
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
IES VE
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
YounusS2
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and Hazards
Seth Reyes
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
Jamie (Taka) Wang
20230104 - machine vision
20230104 - machine vision
Jamie (Taka) Wang
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
Precisely
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
GDSC PJATK
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
Liveplex
Nanopower In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
Pedro Manuel
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
DianaGray10
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
Adtran
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
D Cloud Solutions
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Will Schroeder
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
Mahmoud Rabie
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
DianaGray10
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
dgelyza
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
Bachir Benyammi
Kürzlich hochgeladen
(20)
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and Hazards
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
20230104 - machine vision
20230104 - machine vision
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
Nanopower In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
Lesson 03
1.
Front-End Web Development Lesson 3 Advanced
CSS
2.
Agenda ● ● ● ● ● ● Review (15 minutes) HTML
Template (10 minutes) Box Model (50 minutes) Nested Selectors (20 minutes) Getting Started (10 minutes) Lab Time (60 minutes)
3.
Review Wendy G. Bite ●
index ● resume Homework Shared Class Web Server vs. Schoology
4.
HTML Template template.html reset.css >
source normalize.css > source style.css
5.
Box Model Every element
on a web page is a box. What is an element?
6.
Box Model
7.
Box Model Width =
width + padding-left + padding-right + border-left + border-right Height = height + padding-top + padding-bottom + border-top + border-bottom
8.
Box Model Let’s build
this … Start with … template.html style.css Save as … box_model.html box_model.css
9.
Box Model Apply this
to … Wendy G. Bite index.html resume.html
10.
Nested Selectors Not needed
to complete Assignment Makes more sense once the following is introduced in the next lesson: <div> tags IDs and classes
11.
Getting Started Assignment: Build
Fashion Blog starter code image_1 image_2
12.
Lab Time Assignment: Build
Fashion Blog starter code > add external stylesheet image_1 image_2
13.
Homework Complete Fashion Blog
Jetzt herunterladen