Download presentation
Presentation is loading. Please wait.
1
HTML / CSS Mai Moustafa Senior Web Designer eSpace eSpace
2
Website layers Behavior (JS) Presentation (CSS) Content (HTML) eSpace
3
Website Users Normal Search Engine Disabilities Semantic eSpace
4
HTML eSpace
5
What is HTML? Hyper Text Markup Language Link Link Link eSpace
6
Tags eSpace
7
Nested Tags eSpace
8
Basic Structure eSpace
9
Head eSpace
10
Preview eSpace
11
Body eSpace
12
Preview eSpace
13
Headers eSpace
14
Preview eSpace
15
Paragraph eSpace
16
Preview eSpace
17
Lists eSpace
18
Preview eSpace
19
Div eSpace
20
Preview eSpace
21
Block elements eSpace
22
Inline elements eSpace
23
Preview eSpace
24
More Inline elements eSpace
25
Preview eSpace
26
Attribute Add more info to tag eSpace
27
Preview eSpace
28
HTML 5 tags eSpace
29
Semantic Content Text Media eSpace
30
CSS eSpace
31
What is CSS? Cascading Style Sheets Styles1 Styles2 Styles3 eSpace
32
How to use it? eSpace
33
Rules eSpace
34
Selectors p .name #name Element Class Id eSpace
35
Element Selector eSpace
36
Preview eSpace
37
Class Selector eSpace
38
Preview eSpace
39
ID Selector eSpace
40
Preview eSpace
41
2 Rules eSpace
42
Preview eSpace
43
Specificity 1 10 100 Element Class Id eSpace
44
Class •Use a lot •Lower specificity ID •Use once •Higher specificity
Class VS ID Class •Use a lot •Lower specificity ID •Use once •Higher specificity eSpace
45
Descendent Selector eSpace
46
Preview eSpace
47
Naming eSpace
48
Box Model (Block) eSpace
49
Box Model (Block) eSpace
50
Box Model (Block) eSpace
51
Preview eSpace
52
Margin collapse eSpace
53
Margin collapse eSpace
54
Box Model (Inline) eSpace
55
Box Model (Inline) eSpace
56
Preview eSpace
57
Relative Position eSpace
58
Absolute Position eSpace
59
Fixed Position eSpace
60
Float eSpace
61
Float eSpace
62
Assignment eSpace
63
eSpace Thanks
Similar presentations
