【整理:HTML/CSS】background-position的妙用
作者：zdzhuo 整理日期：2004年6月17日css2.0 中的 background-position 大家用到过吗
怎么用的 用在哪里
js控制图片切换有两个缺陷
1.有时后切换缓慢,需要预载解决
2.要制作2-3套图片
看看怎么用 background-position 解决这个问题
实现快速"切换"
这里只用到一张图片
http://nb001722.sosoo.net/btn.gif
至于代码中的font:10px/1也是不常见的用法
可以参考这里
http://www.w3.org/Style/CSS/Test/CSS1/current/sec5526c.htm
把思维拓宽一下 用在网站地图上呢
<style type="text/css">
#menu a {
display:block;
width:150px;
margin:6px;
padding:10px 0 10px 32px;
font:10px/1 sans-serif;
color:#f90;
background: url("http://nb001722.sosoo.net/btn.gif") top left no-repeat;
text-decoration: none;
}
#menu a:hover {
background-position: 0 -39px;
color:red;
}
#menu a:active {
background: url("http://nb001722.sosoo.net/btn.gif") 0 -78px no-repeat;
color:black;
}
</style>
</head>
<body>
<div id="menu">
<a href="###">Menu link 1</a>
<a href="###">Menu link 2</a>
<a href="###">Menu link 3</a>
<a href="###">Menu link 4</a>
<a href="###">Menu link 5</a>
</div>
看不到什么效果。哎。 4年以前的帖子啦，被别的网站转载了，然后找到这里，没有那个关键性的图片啊
页:
[1]