无需表格的菜单
- Home
- My Blog
- Friends
- Next Station
- Contact Me
怎么让运行结果如此图
回复讨论(解决方案)
已经是这样的效果了
学习,接分。。。
不是 你仔细看 每个
不是 你仔细看 每个
还真没发现你说的问题
不是 你仔细看 每个
还真没发现你说的问题
这段代码结果是: 而我想让结果是: 就那几个
浏览器问题,把border-bottom-width的值设大点效果更明显
浏览器问题,把border-bottom-width的值设大点效果更明显
那个我设置过 但太粗了 我想要的不是那个效果 我还有套代码 能实现我说的那个效果
- Home
- My Blog
- Friends
- Next Station
- Contact Me
但我不知道之前发的那套为啥达不到此效果
每个元素想一个盒子模型,你可以搜索一下。四边的border其实是有交叉的,所以每个border是一个梯形而不是长方形。这是导致你的第一个样式想过的原因,通过楼上的那个把border-bottom加大的例子就看得很清楚。网上有通过这种特性来制作纯css的三角形的例子。
你的第二个样式,是通过设置外层li的border-bottom来避免内层a的padding给border带来的影响。
另外可以试试通过设置ul的背景和li的margin实现border的效果。点击查看 在线演示
但我不知道之前发的那套为啥达不到此效果