Абсолютно невидимые кнопки HTML - PullRequest
Новая
       47

Абсолютно невидимые кнопки HTML

7 голосов
/ 21 апреля 2011

Используйте следующий код: 

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

Сохраните этот файл как HTML-файл. Если вы открываете файл, появляется невидимая, но все еще активная кнопка. Нажмите Tab, чтобы выбрать кнопку. Теперь есть серый пунктирный прямоугольник вокруг все еще невидимой кнопки. Может кто-нибудь помочь мне отключить этот прямоугольник. Спасибо респондентам

Я пытаюсь сделать абсолютно невидимый логин на сайте, это единственная видимая часть, пожалуйста, помогите.

Ответы [ 5 ]

18 голосов
/ 21 апреля 2011

Вы можете использовать стиль outline: 0;, чтобы отключить пунктирный прямоугольник от кнопки, когда она находится в фокусе.

Пример: 

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

Хотя яя не уверен, что то, что вы пытаетесь сделать, является правильным ... Вы просто пытаетесь скрыть кнопку?Лучше всего использовать display: none;

Пример: 

<input type="submit" style="display: none;">
4 голосов
/ 28 ноября 2013

Это работает для меня. (Проверено только на Opera, поэтому YMMV). 

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

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

1 голос
/ 21 апреля 2011

Использовать CSS: focus &: активные псевдоклассы 

<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>
0 голосов
/ 10 апреля 2017

Просто сделайте его прозрачным, как вы это сделали, а затем отключите кнопку. Это прекрасно работает для меня. 

<input type="submit" style="color: transparent; background-color: transparent; border-color: transparent; cursor: default;" disabled>
0 голосов
/ 28 марта 2013

Не используйте кнопку вообще.

Используйте AJAX для отправки данных для входа в систему по почте и обработки ответа на вашей странице.

...