一、布局概念
Layout：布局容器，其下可嵌套 Header Sider Content Footer或Layout本身，可以放在任何父容器中。
Header：顶部布局，自带默认样式，其下可嵌套任何元素，只能放在Layout中。
Sider：侧边栏，自带默认样式及基本功能，其下可嵌套任何元素，只能放在Layout中。
Content：内容部分，自带默认样式，其下可嵌套任何元素，只能放在Layout中。
Footer：底部布局，自带默认样式，其下可嵌套任何元素，只能放在Layout中。
二、基本结构
三、如何使用
基于Layout布局组件：
高度、宽度：可以设定百分比或者固定PX。
顶部、底部：可以设置显隐、宽高、高级设置控制边距、边框、背景、字体等。
左侧、右侧：可以设置显隐、宽高、折叠，高级设置控制边距、边框、背景、字体等。
四、应用场景
1.拥有侧边导航，区别是两边未留边距，多用于应用型的网站
侧边两列式布局。侧边导航在页面布局上采用的是左右的结构，一般主导航放置于页面的左侧固定位置，辅助菜单放置于工作区顶部。内容根据浏览器终端进行自适应，能提高横向空间的使用率，但是整个页面排版不稳定。侧边导航的模式层级扩展性强，一、二、三级导航项目可以更为顺畅且具关联性的被展示，同时侧边导航可以固定，使得用户在操作和浏览中可以快速的定位和切换当前位置，有很高的操作效率。
2.拥有顶部导航及侧边栏的页面，多用于展示类网站
3.最基本的『上-中-下』布局
一般主导航放置于页面的顶端，从左自右依次为：logo、一级导航项、辅助菜单（用户、设置、通知等）。通常将内容放在固定尺寸（例如：1200px）内，整个页面排版稳定，不受用户终端显示器影响；上下级的结构符合用户上下浏览的习惯，也是较为经典的网站导航模式。页面上下切分的方式提高了主工作区域的信息展示效率。
4.固定头部
一般用于固定顶部导航，方便页面切换。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/226464.html原文链接：https://javaforall.net
