课程: Advanced Responsive Layouts with CSS Flexbox

今天就学习课程吧！

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

Marking up the holy grail layout in HTML

Marking up the holy grail layout in HTML - CSS教程

课程: Advanced Responsive Layouts with CSS Flexbox

开始一个月试用 购买团队方案

Marking up the holy grail layout in HTML

“

- In the exercise files for Chapter 4, under 04_02, you will find holy-grail.html, and holy-grail.css. These are the two files we will be working with to create our Flexbox based Holy Grail layout. Just like in the previous movies, we'll start by looking at the mark-up in holy-grail.html. And if you look from the top, you'll see this looks pretty much like the other demo pages. When we scroll down, there are a few notable differences. You'll see here, before we get to the header with the class "masthead," I've added a new div with the class "outer-wrap." And this div will wrap around all the content on the page, and will be the baseline that we're going to be using for our Flexbox based layout. Within "outer-wrap" we have three main sections: we have a header with the class "masthead," then we have a div with the class "content," and then, finally, we have a footer with the class "footer-area." Within each of these main content sections, we have further divisions. So, for instance, in…

内容