08_02导航圆角背景2
2014-11-06 21:57
211 查看
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> .menu { width: 221px; background: black; } /*btn不平铺,且拉伸。局限性:为导航选项宽度过大时,有缝隙。*/ .btn { width: 71px; background:url(img/btnM.png) no-repeat; float: left; margin-left: 2px; } /*btnL删除*/ .btnR { background: url(img/btnR.png) no-repeat right 0; height: 31px; text-align: center; line-height: 31px; } .clear { clear: both; } </style> </head> <body> <div class="menu"> <div class="btn"> <div class="btnR">主页</div> </div> <div class="btn"> <div class="btnR">博客</div> </div> <div class="btn"> <div class="btnR">关于</div> </div> <div class="clear"></div> </div> </body> </html>
上述代码效果:
!!导航选项宽度大于背景图片宽度时,有缝隙:
相关文章推荐
- 08_01导航圆角背景1
- 08_03导航圆角背景应用
- 【Android UI】案例02 圆角边框、圆角背景的实现(shape)
- 导航圆角的长短背景做法
- 【Android UI】案例02 圆角边框、圆角背景的实现(shape)
- NEC学习 ---- 模块 -文本圆角背景导航
- 圆角导航菜单制作(图片作为背景)
- 背景为圆角的导航
- android 动态设置圆角背景(来自http://www.oschina.net/code/snippet_189899_23696)
- 元素带圆角背景图片自适应
- jQuery制作的别致导航有阴影背景高亮模式窗口
- (2015/10/5)jQuery实现鼠标悬停背景翻转的黑色导航菜单代码(状态:未完成)
- iphone关于单倍图和二倍图(导航 背景 变高)
- android实现圆角矩形背景的方法
- 设置表格的选中背景为圆角
- 不使用背景图片实现圆角效果
- jQuery全屏背景图片导航
- android 背景边框变圆角的几种方法
- CSS实现背景图片不规则的导航菜单
- Android SpannableString 设置文字圆角背景