CSS-几个好用的属性

1.attr

1
2
3
4
5
6
<p data-unit="元">剩余话费40</p>

[data-unit]:after {
content: attr(data-unit);
color: #3b98e0;
}

2. currentColor是color属性的值

1
2
3
4
5
6
.box {
width: 200px;
height: 200px;
color: #3b98e0;
border: 1px solid currentColor;
}

3.user-select 禁止选择文本

1
2
3
4
5
.box-1 {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

4.selection 可设置文字被选择时的样式

1
2
3
4
::selection {
background: #FE6E66;
color: #FFF;
}

只能向 ::selection 选择器应用少量 CSS 属性:color、background、cursor 以及 outline