Python for Entrepreneurs Transcripts
Chapter: Web design foundations
Lecture: CSS: Layout demo intro
Login or
purchase this course
to watch this video and the rest of the course contents.
0:02
So, it's time to talk about layout, and layout works in conjunction with the box model
0:09
to basically determine how things look on the screen, where they get placed, when there is new line wraps and so on.
0:15
If you understand a few things about CSS like the layout, the box model and the selectors, you are like 80% of the way there.
0:23
So, let's take a pretty cool example here, here we have a list of items, they are actually hyperlinks that go to the various parts of our pages,
0:30
home, CSS selectors, CSS box model layout and float items, so these should be pretty familiar to you by now,
0:36
that's just the little list that's on the home screen but notice this is on /layout,
0:40
there is no extra stuff, it's really just this little bit on the screen. So we are going to do just a little bit of CSS and tweak with the layout
0:47
to turn this into a full-on navigational menu. Now, just to be clear, this navigational menu is probably not what you wanted to do for real navigation,
0:57
we are going to get to Bootstrap and responsive design and drop down menus and all sorts of cool stuff,
1:02
but this is more just to show you like look how dramatically we can change the layout and the appearance of a numbered list more or less,
1:11
so this is going to be really cool and it won't take much effort at all so let's go do this.