摘要
下载地址: 点击下载 效果描述： 最近网上看到一个前端面试题，要求面试者用纯CSS实现一个6边形的效果 乍一看有点乱，但是仔细分析下，其实并没有那么难 将六边形拆开成三部分，左边是一个三角形，中间一个长方形，右侧再来一个三角形，然后再将其定位起来即可 那么就是一个div，内部嵌套三个div即可实现 当然，你也可以省略左右两…
正文
下载地址: 点击下载
效果描述：
最近网上看到一个前端面试题，要求面试者用纯CSS实现一个6边形的效果
乍一看有点乱，但是仔细分析下，其实并没有那么难
将六边形拆开成三部分，左边是一个三角形，中间一个长方形，右侧再来一个三角形，然后再将其定位起来即可
那么就是一个div，内部嵌套三个div即可实现
当然，你也可以省略左右两个div，只用一个div即可实现，怎么办呢？那就是用CSS3的伪类代替左右两个div
使用方法：
1、将style.css中的样式拷贝到你的网页中
2、将body中的代码部分拷贝到你需要的地方即可
关注不迷路
扫码下方二维码，关注宇凡盒子公众号，免费获取最新技术内幕！
温馨提示：如果您访问和下载本站资源，表示您已同意只将下载文件用于研究、学习而非其他用途。
评论0