1
00:00:02,360 --> 00:00:07,360
Welcome to this diving, deeper into HTML and CSS module.

2
00:00:07,680 --> 00:00:08,760
In this module,

3
00:00:08,760 --> 00:00:12,100
we will build up on the knowledge gained in the last module

4
00:00:12,100 --> 00:00:16,720
of this course and dive deeper into some selected HTML

5
00:00:16,720 --> 00:00:21,583
elements and into some slightly more advanced CSS concepts.

6
00:00:22,690 --> 00:00:23,610
Specifically,

7
00:00:23,610 --> 00:00:26,800
we'll have a look at some HTML elements,

8
00:00:26,800 --> 00:00:30,710
the list element for example, to create well, lists in HTML,

9
00:00:30,710 --> 00:00:34,920
and we'll have a look at some semantic elements which help

10
00:00:34,920 --> 00:00:38,010
us to improve our website structure.

11
00:00:38,010 --> 00:00:38,843
As you saw,

12
00:00:38,843 --> 00:00:41,170
our website keeps growing and growing

13
00:00:41,170 --> 00:00:42,900
and at a certain point,

14
00:00:42,900 --> 00:00:46,860
it's time to add a logic or a structure which helps us to

15
00:00:46,860 --> 00:00:50,270
build separate sections on our website.

16
00:00:50,270 --> 00:00:52,263
We'll explore this in this module.

17
00:00:53,510 --> 00:00:56,350
Besides that we'll also look at containers.

18
00:00:56,350 --> 00:01:01,040
Containers is the logic that an element can hold or nest

19
00:01:01,040 --> 00:01:03,420
other elements, something we use already,

20
00:01:03,420 --> 00:01:07,000
but we didn't explore so far and we'll dive deeper into the

21
00:01:07,000 --> 00:01:10,220
cascading logic, we mentioned this in the last module,

22
00:01:10,220 --> 00:01:12,550
but it's time to have a closer look at this.

23
00:01:12,550 --> 00:01:16,861
As other concepts like inheritance and specificity are

24
00:01:16,861 --> 00:01:21,230
closely connected to this cascading logic.

25
00:01:21,230 --> 00:01:22,350
In addition to that,

26
00:01:22,350 --> 00:01:25,680
we'll also have a look at the CSS box model.

27
00:01:25,680 --> 00:01:28,770
The CSS box model defines the way

28
00:01:28,770 --> 00:01:33,770
CSS interacts with HTML elements and brings the topics of

29
00:01:34,480 --> 00:01:38,940
content padding, border, and margin into play.

30
00:01:38,940 --> 00:01:41,350
We used some of these properties already,

31
00:01:41,350 --> 00:01:42,640
but with the box model,

32
00:01:42,640 --> 00:01:46,410
we'll finally really understand how all these properties

33
00:01:46,410 --> 00:01:49,023
work and why they work in a certain way.

34
00:01:49,970 --> 00:01:52,840
As you see lots of content to cover, therefore,

35
00:01:52,840 --> 00:01:54,240
let's dive into this module.

