Html 悬停在标签上时,鼠标指针变为手形
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7176942/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
While hovering over a label, mouse pointer changes to hand
提问by saurabh ranu
When I am hovering over an HTML label the mouse pointer changes to a hand image which we generally get when clicking a link. How can I avoid that?
当我将鼠标悬停在 HTML 标签上时,鼠标指针会变为我们通常在单击链接时获得的手部图像。我怎样才能避免这种情况?
回答by Joshua Carmody
The reason why you might get a hand cursor in some browsers, is because one of the main purposes of a label element in most browsers is to provide a clickable description for a form input element. For example, this is a typical use of the <label>
element:
在某些浏览器中您可能会看到手形光标的原因是,大多数浏览器中标签元素的主要目的之一是为表单输入元素提供可点击的描述。例如,这是<label>
元素的典型用法:
<input type="checkbox" name="TermAgreement" id="TermAgreement" />
<label for="TermAgreement">I agree to these terms</label>
In most browsers, this will result in the text "I agree to these terms" being clickable. When you click on the text, it will toggle the checkbox with an ID of TermAgreement
, just as if you had clicked on the check box itself.
在大多数浏览器中,这将导致文本“我同意这些条款”可点击。当您单击文本时,它将切换 ID 为 的复选框TermAgreement
,就像您单击复选框本身一样。
(Note: The W3C specification for <label>
in HTML 5doesn't require this behavior, but it does say that the browser's implementation of <label>
"should match the platform's label behavior". In practice, this usually means <label>
elements are clickable.)
(注意:HTML 5中的 W3C 规范<label>
不要求这种行为,但它确实说浏览器的<label>
“应该匹配平台的标签行为”的实现。实际上,这通常意味着<label>
元素是可点击的。)
So essentially, the cursor behaves as though the <label>
is a link because it isa link, of a sort. If you're using it differently, you might want to consider using a different HTML element instead.
所以本质上,光标的行为就像<label>
是一个链接,因为它是一个链接,某种类型的。如果您以不同方式使用它,您可能需要考虑使用不同的 HTML 元素。
Whether or not a particular user sees a hand cursor when mousing over a label will vary depending on their OS and browser. Chrome and Firefox aren't displaying this behavior for me on Windows XP, but other platforms might. Also, it's possible that you have a CSS file included which specifically calls for this behavior. There would be a rule in your CSS that looks something like this:
特定用户在将鼠标悬停在标签上时是否看到手形光标会因他们的操作系统和浏览器而异。Chrome 和 Firefox 在 Windows XP 上不会为我显示这种行为,但其他平台可能会。此外,您可能包含一个专门要求此行为的 CSS 文件。在你的 CSS 中会有一个看起来像这样的规则:
label {
cursor: pointer;
}
If you want to override the element's default behavior, you can use cursor: default;
in your CSS, as @rickyduck said. You can find information on the CSS cursor property here. Note that changing the cursor will not necessarily mean the element won't respond to being clicked.
如果你想覆盖元素的默认行为,你可以cursor: default;
在你的 CSS 中使用,正如@rickyduck 所说。您可以在此处找到有关 CSS 光标属性的信息。请注意,更改光标并不一定意味着元素不会响应被点击。
If this doesn't solve your problem, please provide us with more information. Sample code, the URL of the page displaying the behavior, as well as which browser you're using would also be good to know.
如果这不能解决您的问题,请向我们提供更多信息。示例代码、显示行为的页面 URL 以及您使用的浏览器也很重要。
回答by rickyduck
<label style="cursor:default">Text<label>
<label style="cursor:default">Text<label>