课程: Advanced Responsive Layouts with CSS Flexbox

今天就学习课程吧!

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

Styling the holy grail layout with Flexbox

Styling the holy grail layout with Flexbox - CSS教程

课程: Advanced Responsive Layouts with CSS Flexbox

Styling the holy grail layout with Flexbox

- Before writing out my different CSS rules, I need to do a little bit of planning here. You'll remember that in the markup I have a container that wraps around all my content and I can, if I want to, use that container as a Flexbox. That way I can reorder the content on my page, maybe move the menu up above the site title, if I want to on certain screens, or maybe move the menu and the site title below the main content, or do a bunch of other things without changing the markup itself. Basically, by wrapping everything in a Flexbox, I harness the power of Flexbox and its ability to reorganize my content but I don't have to use it if I don't want to. The next thing I want to do is make sure that my main content here and the sidebar content actually appears as content on the left and the right hand side. This is where Flex box is going to help me the most. So I have to make a container that holds both of these areas into a Flexbox. Then later on in the course, I'm also going to use Flex…

内容