文本与段落
1
| font-family: Arial, 'Microsoft Yahei', sans-serif;
|
1
2
3
4
5
6
| @font-face {
font-family: 'webfont';
src: url('webfont.woff');
}
font-family: 'webfont', Arial, 'Microsoft Yahei', sans-serif;
|
1
2
| writing-mode: vertical-rl;
text-orientation: mixed;
|
1
| text-decoration: underline line-through;
|
1
2
3
| white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
|
1
| background-color: #8be5ac;
|
1
| background-image: url(./bg.jpg);
|
1
| background-repeat: no-repeat;
|
雪碧图通常使用该属性实现
1
| background-position: center center;
|
1
2
| background-size: contain; /* 充满容器,可能会留白 */
background-size: cover; /* 充满容器,可能会裁剪 */
|
外发光悬空阴影
1
| box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
HSL
定义 HSL 颜色
- 色相(H) 是色彩的基本属性,就是平常所说的颜色名称,如红色、黄色等。
- 饱和度(S) 是指色彩的纯度,越高色彩越纯,低则逐渐变灰,取 0-100% 的数值。
- 亮度(L) ,取 0-100%,增加亮度,颜色会向白色变化;减少亮度,颜色会向黑色变化。
https://www.runoob.com/cssref/func-hsl.html
参考:https://www.bilibili.com/video/BV1654y1m76w?p=1&share_medium=iphone&share_plat=ios&share_source=COPY&share_tag=s_i×tamp=1598287257&unique_k=KP2sHN
警告
本文最后更新于 November 15, 2019,文中内容可能已过时,请谨慎使用。