Heim >Web-Frontend >HTML-Tutorial >***请教，这种仿淘宝样式得排序样式怎么弄？_html/css_WEB-ITnose
***请教，这种仿淘宝样式得排序样式怎么弄？_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:20:561277Durchsuche
请教，这种仿淘宝样式得排序样式怎么弄？
选择背景即变，就像选项卡一样，求代码
回复讨论(解决方案)
问题补充：
以下是实现的切换按钮，问题是为什么在ie浏览器，世界之窗浏览器 里测试 ，鼠标移上去或移上去后离开，背景颜色变橙色，而在360浏览器，谷歌浏览器里颜色始终是白色？求高手指点
附代码：
#navColumn {width:710px;}
#navColumn ul {padding-left:2px;height:29px;margin:0px;padding:0px;font-size:12px;text-align:center;list-style:none;}
#navColumn li {float:left;line-height:29px; height:29px;text-align:center;width:82px;background:#fff;}
#navColumn li.now a:link,#navColumn li.now a:visited {color:#FC8004;font-size:14px;font-weight:700;background:#FC8004;}
#navColumn a:link,#navColumn a:visited {width:82px;display:block;}
#navColumn a:hover,#navColumn a:active {width:82px;height:29px;display:block;text-decoration:none;font-weight:700;background-color:#FC8004;}
按钮代码：
这是需要js配合的，当点击后给当前标签添加一个selected的样式名，然后给selected添加个background-color即可。
理解错误。。。也没看到你后来的补充，不好意思。看了下，你那个在谷歌浏览器里也是正常的，按理说都是正常的，可能是你浏览器缓存的问题吧。
不行，我这里测试不行，360浏览器，谷歌浏览器不显示背景色
不行，我这里测试不行，360浏览器，谷歌浏览器不显示背景色
随便写个给你看看。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>demo</title><style type="text/css"> a { display:block; text-decoration:none; float:left; border:1px solid silver; width:60px; height:25px; line-height:25px; text-align:center; } a:hover{ background-color:red; }</style></head><body><div class = "nav"> <a href="#">Item1</a> <a href="#">Item2</a> <a href="#">Item3</a></div></body></html>