随笔分类 - 前端 / CSS3
摘要：CSS动画 什么是 CSS 动画？ 动画使元素逐渐从一种样式变为另一种样式。 您可以随意更改任意数量的 CSS 属性。 如需使用 CSS 动画，您必须首先为动画指定一些关键帧。 关键帧包含元素在特定时间所拥有的样式。 | 属性 | 描述 | | : : | : : | | @ keyframes |
阅读全文
摘要：CSS过渡 想要实现过渡，要明确两件事 要添加效果的CSS属性 效果持续的时长 如果没有规定持续的时长则不会有过渡效果，因为默认值是0 当光标从元素上离开时，会立刻变为原始样式 transition-property：规定过渡效果所针对的 CSS 属性的名称 transition-duration：
阅读全文
摘要：transform属性 | 值 | 描述 | | : : | : : | | none | 定义不进行转换 | | matrix(n,n,n,n,n,n) | 定义 2D 转换，使用六个值的矩阵 | | matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) | 定义 3
阅读全文
摘要：background-size（背景尺寸） background-origin（定义背景图像的位置） background-clip（背景的绘制区域） 多重背景 CSS 允许您通过 background-image 属性为一个元素添加多幅背景图像 不同的背景图像用逗号隔开，并且图像会彼此堆叠，其中的
阅读全文
摘要：flexbox布局模块 注意，设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。 设置弹性布局的方法 通过将 display 属性设置为 flex，flex 容器将可伸缩 点击查看代码 <!DOCTYPE html> <html> <head> <st
阅读全文
摘要：渐变背景 原文链接：https://blog.csdn.net/Mq_sir/article/details/121053167 一、线性渐变(向上\下\左\右,左上，右上等等) 通过属性Inear-gradient来定义一个线性渐变 1、to+方向 background-image:linear-
阅读全文
