标签：浮动 定位 元素 标签 HTML02 设置 position
- 独占一行的标签叫块级标签;
- 可以在一行上展示的标签叫做内联标签;
- 块级标签和内联标签可以切换, 通过控制标签的显示方式。
display: inline;将元素设置为内联元素;display: block;将元素设置为块级元素;
- 垂直居中显示: line-height等于容器的高度.
- 文本居中: text-align: center;
- 设置内边距: padding: 20px;
- 设置外边距: margin: 20px;
- 设置边框: border 1px solid 颜色;
- 设置圆边角: border-redius:10px;
- 组件在流布局中居中: margin: 0 auto;
- 鼠标靠近会变成小手: cursor: pointer;
- 缓慢变化: transition: all 0.8s;
-
z-index属性用于控制元素的堆叠顺序(z轴顺序),在上层显示: style="z-index: 99
- 伪类控制子组件:
.boxd:hover .boxc{
left:200px;
}
- 向左浮动: float:left 让div在同一行显示;
- 向右浮动:float:right
- 取消浮动: <div style="clear:both;"></div>;
- 静态定位:
static是HTML元素的默认定位方式。这种定位方式不会受到top、bottom、left或right等属性影响。 position: static;
- 相对定位: 占据原来的空间 参照物为该组件原来的位置; position: realtive;
- 绝对定位: 不占空间 参照物:第一个非static定位的父组件,如果找不到这样的父组那就是html position:absolute;
- 窗口定位: 不占空间 参照物:浏览器窗口 position:fixed;
标签：浮动,
定位,
元素,
标签,
HTML02,
设置,
position
From： https://www.cnblogs.com/wxy01/p/17824866.html