每一项之间的菜单行
每一项之间的菜单行
提问于 2012-09-14 12:40:52
这是我的布局菜单：
http://gyazo.com/da1f1954a34694facaaab8ce6c92b267
您能看到每个菜单项之间的黑白低不透明度线条吗？我怎么才能把它们做成那样的尺寸呢？你还可以看到每个菜单项中都有一个空格量，我该怎么做呢？
谢谢
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-09-14 12:53:34
1)对于边框使用rgba：
your_li_element_selector {
border-right: 1px solid rgba(255, 255, 255, 0.5); /* white border with opacity 50% */
border-left: 1px solid rgba(0, 0, 0, 0.5); /* black border with opacity 50% */
}隐藏第一个菜单项的左边框：
your_li_element_selector:first-child {
border-left: 0;
}隐藏最后一个菜单项的右边框：
your_li_element_selector:last-child {
border-right: 0;
}2)对于空间，使用li元素的margin和padding属性以及其中的a。
Stack Overflow用户
发布于 2012-09-14 13:14:06
您可以使用RGBA设置左边框和右边框，并向下更改不透明度。第一个孩子和最后一个孩子删除额外的边框。缺点是上面的东西在一些较老的浏览器中不能工作。正如@dev所说，最适合的可能是使用图片。
使用RGBA、第一个孩子和最后一个孩子的示例：http://jsfiddle.net/Ra9NT/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12424767
复制
相似问题
CSS子菜栏
叶菜：%%的问题？
在ruby on rails中设置中国菜、印度菜的常量值
脐带菜的背景颜色
在Freebase中获取每个菜页的菜品清单和详细信息？
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
