个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我有一个页面，其中一个按钮标有一个字形图标( Bootstrap )。
我有一个新要求，即使用“Wave”工具(https://wave.webaim.org/extension/)检查页面时不能出现“错误”。
问题是 Wave 会为按钮引发错误，因为它是一个“空按钮”。
我尝试使用带有替代文字的图像。这修复了 Wave 错误，但它使按钮稍微变大了，我也对为此滥用图像感到不安。
这是显示问题的页面的最小版本:
<html lang="en">
<head>
<title>title</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
</head>
<body>
<div>
<button>
<span class="glyphicon glyphicon-chevron-up"></span>
</button>
</div>
<div>
<button>
<span class="glyphicon glyphicon-chevron-up"></span>
<img src="https://upload.wikimedia.org/wikipedia/commons/c/ce/Transparent.gif" alt="UP button">
</button>
</div>
</body>
</html>
最佳答案
不要添加带有替代文本的图像，而是添加 aria-label或 title带有所需文本的按钮上的属性。
<html lang="en">
<head>
<title>title</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div>
<button>
<span class="glyphicon glyphicon-chevron-up"></span>
</button>
</div>
<div>
<button aria-label="UP button" title="UP button">
<span aria-hidden="true" class="glyphicon glyphicon-chevron-up"></span>
</button>
</div>
</body>
</html>关于html - 使用 Bootstrap 字形图标时如何修复 "empty button"Web 可访问性错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51150103/
24
4
0
我遇到过这个 html: 上面的html和这个有什么区别: 最佳答案 来自MDN page on the tag : 对于 type 的属性标签，可能的值是: 提交:按钮将表单数据提交给服务器
Button button= (Button) findViewbyID(R.id.button); 和 Button button = new Button(this); 有什么区别？ 最佳答案 有
我是一名优秀的程序员,十分优秀！