CSS的概念
层叠样式表(英文全称:Cascading Style Sheets) *层叠:多个样式可以作用在同一个html的元素上,同时生效
是一种用来表现HTML或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一个
CSS很像化妆,通过不同的CSS将同样的HTML内容打造为不同的呈现结果。
1、隐藏滚动条
.element::-webkit-scrollbar {
display: none;
}
2、禁止用户选择
div {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
3、暂停动画
animation-play-state可以控制动画状态
4、透明图片阴影
相信你一定用过box-shadow属性给盒子设置阴影吧,但是当你想要给透明图片添加阴影的时候,却看起来像加了个边框!这时候神奇的drop-shadow就派上用场了。
drop-shadow 的工作方式是,其遵循给给定图片的 Alpha 通道。因此阴影是基于图片的内部形状,而不是显示在图片外面。
5、背景文字
利用background-clip: text;规定背景的绘制区域,再把文字颜色设置为透明实现。