![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
小楠哥!
这个作者很懒,什么都没留下…
展开
-
CSS实现图像旋转动态效果
例如向一个名为img01的类选择器添加旋转样式,在animation属性内设置,旋转动画,rotate为动画名(自定义的名称),6s为周期,linear为线性渐变(取消渐变效果),infinite为无限循环,即每轮动画结束后自动进入下一轮,实现无限旋转效果。 .img01{ display: block; animation: rotate 6s linear infinite; } @keyframes rotate{ 0%{ transform: rotateZ(0deg原创 2021-02-04 15:54:19 · 883 阅读 · 0 评论 -
值得收藏的 CSS 形状
1.上三角 #triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } 2.下三角 #triangle-down { width: 0; height: 0; border-left: 50px solid transparen转载 2020-07-04 10:27:12 · 131 阅读 · 0 评论 -
文字少于一行时居中,超过一行时靠左
文字少于一行时居中,超过一行时靠左 ##css部分 .box{ text-align: center; } .text{ display: inline-block; text-align: left; } ##html部分 文字长度 原理: 给 p 标签设置 inline-block 后,该标签变成 内联块级元素。根据内联元素的特性,宽度为 auto 默认值时,真实宽度为文本的宽度...原创 2019-01-19 19:55:33 · 786 阅读 · 0 评论