0
0
黄舟
发布时间：2017-07-19 15:13:29
|2236人浏览过
|来源于php中文网
原创
一般情况下导航菜单的背景图片都是比较有规则的，但是平时我们也会遇到很多背景图片形状不规则导航条（比如但鼠标移上的时候，背景图片不规则，本例只讨论此种类型）,如下图所示：
（图一）
当鼠标移上去的时候背景变成红色箭头，也许，咋一看，觉得这个效果并没有什么特别的地方，但是仔细看看我画上去的绿色框框部分，就会发现每一块都是接在一起的不会断开的；如果说按照普通方法来做，那么实现的可能是下图所示的效果：
（图二）
即是块与块之间是断开的。
立即学习“前端免费学习笔记（深入）”；
在这个效果的实现过程中最关键的地方就是把“li”的margin值左右两边设为负数，然后把“li”和”a“的宽度设成一样，这样”a“的宽度就是固定的了，而”li“左右两边因为有margin，所以会缩小。
相关文章
css 想让图片在鼠标经过时平滑放大动画怎么办_使用 transform scale keyframes 定义放大
css实战项目_开发一个个人作品集页面
css 初级项目中图文混排不美观怎么办_通过 flex 调整图文结构
css 初级项目页面在不同分辨率下变形怎么办_通过基础响应式规则处理
css图片和文字叠加布局难实现怎么办_结合position absolute实现覆盖
相关标签:
本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
热门AI工具
相关专题
本专题系统讲解 Golang 应用的性能分析与调优方法，重点覆盖 pprof 的使用方式，包括 CPU、内存、阻塞与 goroutine 分析，火焰图解读，常见性能瓶颈定位思路，以及在真实项目中进行针对性优化的实践技巧。通过案例讲解，帮助开发者掌握 用数据驱动的方式持续提升 Go 程序性能与稳定性。
9
2026.01.22
热门下载
相关下载
精品课程
共12课时 | 0.5万人学习
共7课时 | 0.4万人学习
共3课时 | 9万人学习
最新文章
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
