Scribd
Upload
67 views91 pages

Web Design Class 4

This document appears to be a series of slides from a lecture on CSS (Cascading Style Sheets) given by Dr. Fouad Kharroubi at the University of Chouaib Doukkali in El Jadida, Morocco. The slides cover topics such as CSS selectors like class and ID selectors, CSS comments, how to insert CSS using internal, external and inline styles, the cascading order of CSS, applying CSS to HTML tables, and more examples of CSS tables. Each slide includes the date, lecturer, university, year and slide number. Questions are also posed on some slides to prompt discussion.

Uploaded by

M Yacine
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
67 views91 pages

Web Design Class 4

This document appears to be a series of slides from a lecture on CSS (Cascading Style Sheets) given by Dr. Fouad Kharroubi at the University of Chouaib Doukkali in El Jadida, Morocco. The slides cover topics such as CSS selectors like class and ID selectors, CSS comments, how to insert CSS using internal, external and inline styles, the cascading order of CSS, applying CSS to HTML tables, and more examples of CSS tables. Each slide includes the date, lecturer, university, year and slide number. Questions are also posed on some slides to prompt discussion.

Uploaded by

M Yacine
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 91

Royaume du Maroc

Ministère de l’Education Nationale, de la Formation Professionnelle


de l'Enseignement Supérieur et de la Recherche Scientifique

Université Chouaib Doukkali,


Ecole Nationale des Sciences Appliquées d’El Jadida (ENSA)
2017-2018

An Introduction To Web Design

Semester 2
2ITE/Grade 1/Class 4

Dr.-Ing. Fouad KHARROUBI


CSS Selectors: Grouping Selectors

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 2


CSS Selectors: The class Selector

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 3


CSS Selectors: The class Selector

What will be the


output?

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 4


CSS Selectors: The class Selector

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 5


CSS Comments
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 6


CSS Comments

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 7


CSS Comments

What will be the


output?

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 8


CSS Comments

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 9


How To Insert CSS?
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 10


How To Insert CSS?

02/21/2018 11
Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018
1. External Style Sheet
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 12


External Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 13


External Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 14


External Style Sheet

What will be the


output?

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 15


External Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 16


2. Internal Style Sheet
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 17


Internal Style Sheet

Dr-Ing Fouad KHARROUBI


02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 18
Central South University of Forestry and Technology
Internal Style Sheet

What will be the Output?

Dr-Ing Fouad KHARROUBI


02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 19
Central South University of Forestry and Technology
Internal Style Sheet

Dr-Ing Fouad KHARROUBI


02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 20
Central South University of Forestry and Technology
3. Inline Style Sheet
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 21


Inline Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 22


Inline Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 23


Multiple Style Sheet
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 24


Multiple Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 25


Multiple Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 26


Multiple Style Sheet

What will be the Output?

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 27


Multiple Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 28


Multiple Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 29


Multiple Style Sheet

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 30


Cascading Order
☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 31


Cascading Order

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 32


CSS and HTML Tables☺

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 33


Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 34
Central South University of Forestry and Technology
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 35
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 36
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 37
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 38
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 39
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 40
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 41
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 42
Dr-Ing Fouad KHARROUBI Central South
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 43
University of Forestry and Technology
Dr.-Ing.Fouad Dr-Ing
KHARROUBI
Fouad KHARROUBI UCD-ENSAJ
02/21/2018 44
2017-2018
Central South University of Forestry and Technology
Dr.-Ing.Fouad Dr-Ing
KHARROUBI
Fouad KHARROUBI UCD-ENSAJ
02/21/2018 45
2017-2018
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 46
Dr-Ing Fouad KHARROUBI Central South
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 47
University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 48
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 49
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 50
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 51
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 52
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 53
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 54
Dr-Ing Fouad KHARROUBI Central South
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 55
University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 56
CSS Tables (more examples)

02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 57


02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 58
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 59
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 60
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 61
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 62
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 63
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 64
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 65
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 66
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 67
Central South University of Forestry and Technology
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 68
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 69
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 70
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 71
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 72
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 73
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 74
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 75
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 76
Dr-Ing Fouad KHARROUBI
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 77
Central South University of Forestry and Technology
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 78
02/21/2018 Dr.-Ing.Fouad KHARROUBI UCD-ENSAJ 2017-2018 79
CSS and Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 80
UCD-ENSAJ 2017-2018
CSS Vs. Colors

Dr-Ing Fouad KHARROUBI


3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 81
Central South University of Forestry and Technology
UCD-ENSAJ 2017-2018
CSS Vs. Colors

Dr-Ing Fouad KHARROUBI


Dr-Ing Fouad KHARROUBI UCD-ENSAJ
3/2/2018
02/28/2018 82
2017-2018
Central South University of Forestry and Technology
CSS Vs. Colors

Dr-Ing Fouad KHARROUBI


Dr-Ing Fouad KHARROUBI UCD-ENSAJ
3/2/2018
02/28/2018 83
2017-2018
Central South University of Forestry and Technology
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 84
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 85
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 86
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 87
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 88
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 89
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 90
UCD-ENSAJ 2017-2018
CSS Vs. Colors

3/2/2018
02/28/2018 Dr-Ing Fouad KHARROUBI 91
UCD-ENSAJ 2017-2018

You might also like