-->

CSS精灵导航和用户提供图像禁用(CSS sprites navigation and User w

2019-10-17 17:28发布

我与CSS精灵的CSS菜单,但问题是精灵,我们不使用我们在后台使用内嵌图像仅所以如果图像是在浏览器中禁用,然后什么都不会显示。 这方面的任何解决方案?

例如 :

看到这个菜单和关闭影像: http://line25.com/wp-content/uploads/2009/css-menu/demo/demo.html (它不会被看到,如果图像是在浏览器中禁用)

这个菜单是对这一报价

确保你的网站停用图片作品

 Creating a site that relies too heavily on images is never a good 

理念。 虽然过去的差不多的事情,还有谁在非常低的网络运行速度的用户。 另外,如果用户需要,无论出于何种原因,禁止图像,可他们仍然可以访问他们需要的内容?

http://csswizardry.com/quick-tips/#tip-02

我们不应该使用这种类型的导航。

Answer 1:

不要使用内容的图像精灵。 他们依赖于表现层(CSS)为背景图像。 将在内容层(HTML)您的内容。



Answer 2:

您可以创建一个1x1透明像素的图像,并把它有精灵的专区内。 例如:

<style type="text/css">
#linkContainer {background:url(images/sprite.gif) 0 50 no-repeat}
//sprite selection width/height, set cursor to pointer so users know its a link
#linkContainer img {width:50px;height:25px;cursor:pointer}  
<style>
<div id="buttonContainer"><img src="pixel.gif" alt="Your alt text"></div>


Answer 3:

为什么你需要在菜单ALT文本?



文章来源: CSS sprites navigation and User with image disabled