hexagons.css是一款纯CSS响应式六边形网格布局系统。通过hexagons.css预设的样式，可以非常轻松的制作出六边形图片网格布局。
2022-08-29 17:38:42
211KB
1
图片自动切换实现原理：使用一个div并设置溢出隐藏来只显示一次一张图片，同时设置另一个div（总图片div），尺寸为所有图片横排的总尺寸宽高，作为动画顺序播放，然后使用css3动画，通过对div（总图片div）进行位移，从而达到显示不同的图片，每次偏移一个图片的宽度，即可显示下一张图片。5张图片，需要切换4次。
鼠标实现图片切换原理：通过设置每个超链接的宽度高度，并使用position定位到指定位置，编写每一个超链接的动画来分别切换相应图片的位置，使用hover，当鼠标放在指定超链接上时，实现指定的动画切换到目标图片上。
2022-05-15 14:02:14
26.06MB
1
分页条是web开发中常用的前端组件之一，它能将数据分批次展示给用户。我们知道诸如Bootstrap这类框架都提供了非常漂亮的分页条组件，但是你的项目可能不用到Bootstrap，你想自己定制一个属于你自己项目的漂亮的分页条，那么请看本文。
查看演示 下载源码
本文给大家介绍用纯CSS制作一款漂亮的分页条，可以适应各种PC和手机等移动端屏幕，开发者可以下载源码自行更改css代码，定制属于你自己项目的风格。
HTML结构
分页结构分别由两边的上一页和下一页两个按钮、以及中间的数字页码组成。我们用一个
2022-04-27 12:23:06
50KB
1
一个纯CSS网站，用CSS 小片绘制了30种有趣但不幸濒危的动物，色彩搭配非常好。网站的建立目的是为了让更多的人关注这些濒临灭绝的动物，不要让它们像渡渡鸟一样灭绝了。
2022-04-06 01:41:22
18MB
背景
这几天工作中遇到一个交互需求，要求实现一个效果，当鼠标移入一个元素的时候，元素出现一个动态的边框，如图：
动态边框
思路
看到这个效果，我首先想到的是设置元素的border属性，可惜border不能设置长度，无法实现动效。另外一种实现思路是添加四个div来分别实现上下左右的边框效果，虽然可行，但是要添加四个额外元素，有点儿得不偿失的感觉。难道就没有更好的解决方案了…
就在我绞尽脑汁的时候，灵光乍现，为什么不尝试一下用CSS3多背景来模拟边框呢，背景是可以设置长度的，通过修改背景的长度，就可以实现要求的动效。说干就干，赶快从网上搜索一下CSS3背景的相关知识。
CSS3 Backgro
2022-04-04 00:05:39
85KB
1