CSS corner-shape属性在社区的呼声非常高,现在浏览器终于支持了,可以CSS图形表现效果有飞跃版的提升。
文章关键字 ‘border-radius’
抢先学习大开眼界的CSS corner-shape属性
2025年08月26日,星期二了解infinity、pi等CSS calc()计算关键字
2024年07月15日,星期一CSS技术分享: 文字在圆形内沿着弧线边界排版
2020年04月9日,星期四常见的CSS图形绘制合集
2019年01月14日,星期一分享三个纯CSS实现26个英文字母的案例
2019年01月11日,星期五CSS/CSS3 box-decoration-break属性简介
2019年01月5日,星期六CSS box-decoration-break属性可以指定元素片段在跨行、跨列或跨页(如打印)时候的样式渲染表现。
默认情况下,元素的跨行或跨列渲染都是裁剪分割,各得一部分,借助box-decoration-break属性,可以让换行,或者换列的各部分元素按照独立的样式进行渲染,活用这种特性,可以让我们的布局和样式表现更上一层。
纯CSS实现蜡烛、火焰以及熄灭后烟雾效果
2018年05月16日,星期三本文要展示的效果主要三部分:直立的红烛、跳动的火焰,腾起的烟雾,这三部分都是纯CSS实现的,有兴趣可以看看。
Chrome opacity非1时border-radius圆角边框剪裁问题
2017年10月19日,星期四border-radius:50%可以让元素正方形元素表现为正圆,如果元素设置了border边框,则会表现为一个正圆圈圈,但有时候,border边框的这个圈圈会在边缘处发生剪裁,不是一个完美的圈圈了,这是如何发生的呢?
jquery.guide.js新版上线操作向导镂空提示jQuery插件
2017年05月18日,星期四网站上线或者改版的时候,常常会做一个操作向导,告诉用户一些重要操作到了哪里,或者什么地方隐藏了什么好玩的东西,等等,虽然我都是直接关掉的,或者快速跳过,但是对有部分用户而言还是很有用的。
这种提示比较好的交互效果是采用镂空的半透明遮罩,视觉重点一目了然,类似这样……
“蝉原则”与CSS3随机多背景随机圆角等效果
2017年02月17日,星期五在web设计或交互实现的时候,随机效果是非常常见的,比如说我们希望我们动画看上去运行的是更随机,则可以把动画分解为多个维度,例如水平移动,垂直移动以及旋转缩放等,然后不停的循环,然后很关键的一点就是每个维度动画循环的时间遵循“蝉原则”,这样最后实现动画效果就显得非常随机以及丰富等。