完全不可见的 html 按钮

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5747585/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 08:09:46  来源:igfitidea点击:

Totally invisible html buttons

htmlbuttoninputvisibilityinvisible

提问by VVWdefect

Use the following code:

使用以下代码:

<html>
<body>
<input type="submit" style="color: transparent; background-color: transparent; border-color: transparent; cursor: default;">
</body>
</html>

Save this file as a html file. If you open the file there is an invisible but still active button. Press Tab to select the button. Now there is a grey dotted rectangle arround the still invisible button. Can someone help me to disable that rectangle. Thanks to responders

I'm trying to make a totally invisible site login, that's the only visible part of it, please help.

将此文件另存为 html 文件。如果您打开文件,则会有一个不可见但仍处于活动状态的按钮。按 T​​ab 键选择按钮。现在,仍然不可见的按钮周围有一个灰色虚线矩形。有人可以帮我禁用那个矩形。感谢响应者,

我正在尝试进行完全不可见的站点登录,这是其中唯一可见的部分,请帮助。

回答by McHerbie

You can use the style outline: 0;to disable the dotted rectangle from the button when it's focused.

outline: 0;当按钮处于焦点时,您可以使用该样式从按钮中禁用虚线矩形。

Example:

例子:

<input type="submit" style="outline: 0;">

Though, I'm not sure what you are trying to do is correct... Are you just trying to hide the button? Your best bet is to use display: none;

虽然,我不确定你想要做什么是正确的......你只是想隐藏按钮吗?你最好的选择是使用display: none;

Example:

例子:

<input type="submit" style="display: none;">

回答by concentricpuddle

This works for me. (Only tested on Opera so YMMV).

这对我有用。(仅在 Opera 上测试过,所以 YMMV)。

<input type="submit" style="background:transparent; border:none; color:transparent;">

http://jsfiddle.net/AHsdJ/3/

http://jsfiddle.net/AHsdJ/3/

回答by emcconville

Use CSS :focus & :active pseudo-classes

使用 CSS :focus 和 :active 伪类

<html>
<head>
<style type="text/css">
input:focus, input:active { outline: none;}
</style>
</head>
<body>
<input type="submit" style="color: transparent; background-color: transparent; border-color: transparent; cursor: default;">
</body>
</html>

回答by AntiqueWhale

Just make it transparent as you what did, and then make the button disabled. This works perfectly for me.

就像你所做的那样让它透明,然后禁用按钮。这对我来说非常有效。

<input type="submit" style="color: transparent; background-color: transparent; border-color: transparent; cursor: default;" disabled>

回答by boisvert

Don't use a button at all.

根本不要使用按钮。

Use AJAX to send login data via post and handle the response within your page.

使用 AJAX 通过 post 发送登录数据并处理页面内的响应。