持续更新
| 标签 | 作用 |
|---|---|
| width | 高度 |
| height | 宽度 |
| margin | 边界 auto(居中) |
| border | 边框 |
| dotted | 边框点状 |
| solid | 边框实线 |
| double | 双线最起码3px |
| dashed | 虚线 |
| none | 无边框 |
| float | 浮动(left,right,none) |
| background-color | 背景颜色 |
| color | 文本颜色 |
| font-size | 文本大小 |
| font-family | 文本字体 |
| p:hover{} | 鼠标浮动结果 |
| position | 定位 |
| ：static | 默认值 |
| ：relative | 相对定位 |
| ：absolute | 绝对定位 |
| z-index | 层级 1 2 3 |
| span | 行内元素不会独占一行 |
| display | 彻底隐藏内容和位置 |
| visibility | 只隐藏内容 空间仍在 |
| opacity | 0.1 0.2 内容透明 |
| padding | 内边距 |
| ctrl+/ | 快捷注释 |
| text-align | center |
| text-indent | 2em 首行缩进2 |
| letter-spacing:1em | 设置文字之间的字间距为一个文字 |
| font-weight:bold | 文字加粗 |
| text-align:right | 文字右对齐 |
| font-style:oblique | 文字倾斜 |
| line-height | 设置行间距(行高) |
| text-decoration | 修饰文字 |
| text-indent | 设置段落缩进 |
| text-transform | 转换英文字母大小写 |
| word-spacing | 设置英文单词间距 |
| letter-spacing | 设置中文字符间距 |
| filter:blur(5) | 图片模糊 |
| calc函数 | width:calc(100%-30px) |
| transitional 过渡 | 1.属性(width)或者all 2.花费时间()秒 3.运动曲线 默认ease 可省略4.何时开始 默认是0s 可省略 口诀 谁做过渡给谁加 |
| 2d转换 | |
| transform:translate(x,y) | transform:translateX(n) X和y轴的位置 不脱标 不影响其他元素的位置。对于行内元素是无效的 |
| @media screen and (max-width:360px){样式内容} | 自适应屏幕 |
| cursor | 鼠标样式 5种 |
| outline none | 取消表单轮廓input |
| textarea | 文本域 可拉大缩小 代码尽量在一行 |
| resize:none | 防止拖拽文本域 |
| vertical-align： | bottom middle 中间对齐 设置元素垂直对齐方式 只针对行内或行内块元素有效 top |
| 单行文本溢出 3个条件 | |
| 1.强制一行内显示文本 white-space默认normal自动换行 nowrap强制一行 | |
| 2.超出部分隐藏 overflow:hidden | |
| 3.文本用省略号代替超出部分 txt-overflow:ellipsis | |
| 多行文本溢出省略号 上面2.3条件+以下 有兼容性的问题 ie不行 | |
| display:-webkit-box | 弹性伸缩盒子模型显示 |
| -webkit-line-clame:3 | 限制在一个块元素 显示的文本的行数 |
| -webkit-box-orient：vertical | 设置或检索伸缩盒对象的子元素排列方式 |
