![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS技巧
文章平均质量分 94
weixin_42353446
这个作者很懒,什么都没留下…
展开
-
CSS导航交错过渡动态效果
文档目录DOM编译后的 CSS今天跟大家一起,使用 css3 transform 的几个简单属性,来简单实现一个交错过渡动效的导航菜单。效果如下:DOM我们以最最最~古老的企业站点导航为栗子,创建一个页面结构:<ul class="nav-hover"> <li> <a href="#nogo">首页 <span>Home<...原创 2019-08-20 14:46:59 · 713 阅读 · 0 评论 -
纯样式实现完美Radio单选框
DOM 结构今天将带领大家使用纯样式来实现一个支持 tab 键切换的单选框。主要会用到 ::before 和 ::after 伪元素、CSS 属性选择器、相邻兄弟选择器、CSS3 transform 等,样式会用 SCSS ,因为它更直观、易于阅读。DOM 结构你有多久没出去浪了?创建一个关于出去浪的单选按钮组吧:<h2>你想去哪里浪?</h2><d...原创 2019-08-17 00:01:39 · 12871 阅读 · 0 评论 -
CSS波浪动画进度圆
文档目录DOMSCSS移动APP里有个套餐余量的页面,设计师通常喜欢把剩余套餐或流量的进度做成一个圆的形状,里面再加上波浪。纳尼?还要波浪?????~来来来,给你波浪。。。就是这样子的:话说,写文章真的很费神,此篇不详细分析实现细节,主要思路全部在后面的SCSS注释信息里。DOM创建页面结构:<ul class="wave-progress"> <li class=...原创 2019-09-24 17:43:57 · 1034 阅读 · 6 评论