VUE
2022-07-21 17:30:30 0 举报AI智能生成
css
作者其他创作
大纲/内容
VUE
border-widthborder-colorborder-style
contentpaddingmarginborder
盒模型 boxModel
row/row-reverse & column/column-reverse
flex-dirction: 主轴方向
justify-content: 主轴元素排列方式
flex-wrap: 子元素是否换行
align-content: 侧轴元素排列方式(多行)
align-items: 侧轴元素排列方式(单行)
flex-flow: flex-direction + flex-wrap
父属性
原理
align-self: 控制子项自己在侧轴的对齐方式
子属性
flex
# div元素且类名reddiv.reddiv#green
选择器
一层嵌套: 父子选择器div.box > span
同层最近: 兄弟选择器div + span # div最近的同级span
同层所有: 兄弟选择器div ~ span # div最近的同级span
关系选择器
ul > li:first_child
2n: 偶数2n+1: 奇数-n+2: 前两个
:nth-child(3) # 第三个字元素
:first-of-type # 同类型计算
li:not(:last-child) # 最后一个元素不适用
::first-letter
div.wrap::first-line
::befer # 元素开始的位置
::after # 元素结尾的位置
外框
布局
垂直方向相邻块元素会发生margin重叠
块元素
行内元素不支持设置宽高
行元素
元素
none:left:right:
属性值
不会再独占一行
宽高被内容撑开
特点变成块元素
脱离后不区分块行
浮动后脱离文档流
clear
特点
- 不会被浮动元素覆盖
- 子元素和父元素的margin不会重叠
- 父元素写死高度
- clear
高度塌陷 & BFC
浮动
相对定位: relative
绝对定位: absolute
固定定位: fixed
粘滞定位 :sticky
定位
公司外部资源支持
tips
0 条评论
回复 删除
下一页
