我的CSS笔记: 链接菜鸟 https://www.runoob.com/css/css-tutorial.html
隐藏:
不占位不显示:display: none;
占位不显示:visibility: hidden;
透明度:opacity:0.4;
堆叠顺序:z-index:2;
鼠标:
鼠标事件失效:pointer-events:none;
禁止手势:cursor: not-allowed; (注意不能与pointer-events:none; 一起使用会把禁止手势也给整失效了) layui 禁用class="layui-btn-disabled"
按分辨率调整:
@media screen and (max-1000px) { }
@media screen and (min-1000px) { }
浮动:
清除浮动: clear: both;
尺寸:
1em:当前字体尺寸 、1px :计算机上的一个点(1像素 )
其他:
缩进:text-indent: 2em; /*缩进两个字体大小*/
文本域禁止调整尺寸:resize: none;
显示成大写:text-transform: uppercase;
超长显示成...:
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
input只能输入数字: type="number"
下标样式:
标签<sub>1233444555</sub>
他的样式其实是 :vertical-align: sub; font-size: smaller; 相反:vertical-align:super; 就是上标样式。
input 最多填写两个字:
maxlength="2"
字间距调整:
letter-spacing: -6px;
grid-area:指定开始显示项目的行 / 指定开始显示项目的列 / 指定停止显示项目的行线或要跨越的行数 / 指定停止显示项目的列线,或跨越的列数
让字体竖着显示:
writing-mode: tb-rl;
宽度:自动填满剩余空间:
-webkit-fill-available
layui 特有
下拉选固定向下展示:
.layui-form-selectup dl { top: 42px; bottom: unset; }
微信小程序:
显示在一行:view标签加样式 :display: flex;
阿里巴巴图标库:
从图片取颜色:
http://www.jiniannet.com/Page/allcolor
@