课程: CSS: Advanced Layouts with Grid

免费学习该课程!

今天就开通帐号,24,700 门业界名师课程任您挑!

Overview of the starting point

Overview of the starting point

- [Instructor] Over in Codespaces, you'll find the exercise files for this movie. You'll see the base HTML document that we're using along with the styles for our three-column layout. Now, if you were to open this up in the browser, all you'll see right now is the single-column layout. There's no grid in place yet, and this is just the baseline styles from mobile, but we're looking at it in a wider screen. All I've done on this div with the class of site is to set a maximum width. And when we scroll down, we're just seeing all of these elements stacked one on top of the other in this native flow layout. This is easy to read and great for mobile, but it's not the three-column layout that we want for bigger screens. Before we dive in, let's take a quick look at our HTML to understand the structure. First, we're referencing this base stylesheet that I've used for this entire course. It's got some basic typography styles and also styles for my skip links, which we'll get to shortly. Next,…

内容