Date post: | 27-Jan-2015 |
Category: |
Design |
Upload: | mai-moustafa |
View: | 1,519 times |
Download: | 13 times |
HTML / CSS Mai Moustafa
Senior Web Designer
eSpace
eSpace
eSpace
Website layers
Behavior (JS)
Presentation (CSS)
Content (HTML)
eSpace
Website Users
Semantic
Disabilities
Normal
Search Engine
HTML
eSpace
eSpace
What is HTML?
Link
Link
Link
Hyper Text Markup Language
eSpace
Tags
eSpace
Nested Tags
eSpace
Basic Structure
Head
eSpace
Preview
eSpace
Body
eSpace
Preview
eSpace
Headers
eSpace
Preview
eSpace
Paragraph
eSpace
Preview
eSpace
Lists
eSpace
Preview
eSpace
Div
eSpace
Preview
eSpace
Block elements
eSpace
Inline elements
eSpace
Preview
eSpace
More Inline elements
eSpace
Preview
eSpace
Attribute
eSpace
Add more info to tag
Preview
eSpace
HTML 5 tags
eSpace
eSpace
Semantic
Content
Text Media
CSS
eSpace
What is CSS?
eSpace
Styles1 Styles2 Styles3
Cascading Style Sheets
How to use it?
eSpace
Rules
eSpace
Selectors
eSpace
p
.name
#name
Element
Class
Id
Element Selector
eSpace
Preview
eSpace
Class Selector
eSpace
Preview
eSpace
ID Selector
eSpace
Preview
eSpace
2 Rules
eSpace
Preview
eSpace
Specificity
eSpace
1
10
100
Element
Class
Id
Class VS ID
eSpace
Class
•Use a lot
•Lower specificity
ID
•Use once
•Higher specificity
Descendent Selector
eSpace
Preview
eSpace
Naming
eSpace
Box Model (Block)
eSpace
Box Model (Block)
eSpace
Box Model (Block)
eSpace
Preview
eSpace
Margin collapse
eSpace
Margin collapse
eSpace
Box Model (Inline)
eSpace
Box Model (Inline)
eSpace
Preview
eSpace
Relative Position
eSpace
Absolute Position
eSpace
Fixed Position
eSpace
Float
eSpace
Float
eSpace
Assignment
eSpace
eSpace
Thanks