3. 编辑元素
布局
布局的作用是控制元素的位置，相对定位是元素相对于父容器进行定位的一种布局方式。
1. 布局介绍
右键→样式→布局。
参数解释
l 元素ID：如果元素有id，就会被显示出来，如果元素没有id,也可以自己设置元素id。
l 元素类型：显示当前元素类型，无法设置。
布局容器是一种特殊的元素，其内部可以包含各种元素。这些元素称为这个容器的子元素，这个容器称为这些元素的父容器。
l 布局容器元素ID：显示布局容器元素ID，无法设置。
l 布局容器元素类型：显示布局容器元素类型，无法设置。
l 左边距：元素与其父容器左边的距离。
l 右边距：元素与其父容器右边的距离。
l 上边距：元素与其父容器上边的距离。
l 下边距：元素与其父容器下边的距离。
l 左右覆盖其它元素时，本元素：如果出现本元素和其它元素左右覆盖时，裁剪：去掉出现覆盖的内容，本元素覆盖的内容会被删除掉。滚动条：出现覆盖的内容用滚动条方式来解决。
l 上下覆盖其它元素时，本元素：如果出现本元素和其它元素上下覆盖时，裁剪：去掉出现覆盖的内容，本元素覆盖的内容会被删除掉。滚动条：出现覆盖的内容用滚动条方式来解决。
2. 布局方式
布局方式很重要，如果需要深入了解相关知识，请参考CSS position 属性。
l 默认：默认布局，没有设置任何布局。
l 容器：相对定位，生成相对定位的元素，位置不固定。
l 相对父容器定位：绝对定位，生成绝对定位的元素，相对于父元素进行定位。位置是固定的。
l 全屏定位：生成绝对定位的元素，相对于浏览器窗口进行定位。可以做到自适应问题。
l 初始值：设置为默认的初始值。
l 派生值：是从父元素继承 position 属性的值。父元素position值是多少，继承的子元素position值就是多少。
3. 功能演练
滑动定位功能：滑动定位可以实现让元素滑动到顶部或者底部时固定住。效果如zealer主页的滑动到顶部固定。
（1）选中元素→右键→样式。
（2）样式→布局→布局方式→滑动固定。
（3） 通过属性设置“滑动固定上边距“(滑动固定下边距)来设置，页面滑动多少（单位：px），（例如设置为100px时，当滑动100px后就不会在滑动，而固定在屏幕上。）
注意：只需要添入数字即可，不要带单位。
通过属性设置左边距、右边距、上边距、下边距，来设置该元素fix定位在屏幕上的位置（滑动停止后元素在屏幕的位置）
切换到样式—盒模型设置中，找到宽度设置为100%（也可以是你需要的合适的宽度值），如果元素被遮挡。找到z索引（例如：1）该属性控制元素的层级关系，防止被其它元素遮挡，值为整数，可以是负数（没有单位）如果需要深入了解相关知识，请参考z-index。
4. 需求案例
以下是帖子#19212需求实现过程记录
（1）在演示过程中开始只设置了一个外层div的全屏定位，无法使该div内包含的内容自适应屏幕完全显示，依然是用padding或者margin来撑开布局。
（2）可以对一个页面内的多个元素设置全屏定位，不会影响编辑和页面显示，所以将靠近外边框的元素都设置了全屏定位，这样既实现了页面晃动问题又实现了内容的自适应。
5. 特殊情况
如果设置了全屏定位, 但是看到的元素位置没有变。这是因为只有在发布时，才显示为全屏定位。
虽然位置没变，但是在行列布局界面下，全屏定位元素的背景会变为红色，方便知道哪些元素被设置为全屏定位。
下图为效果示意：
