Добавление эффекта свечения в поля ввода и кнопки - PullRequest
Новая
       10

Добавление эффекта свечения в поля ввода и кнопки

1 голос
/ 03 августа 2011

Я нахожусь в процессе создания своей HTML-формы и хочу добавить к ней эффекты.

Возможно ли для <input name="" type="text" class="" /> иметь эффект свечения?

Будет лиВозможно ли, чтобы кнопка «Отправить» также имела этот эффект?

Ответы [ 3 ]

2 голосов
/ 03 августа 2011

Работает для всех входов класса Button 

input.Button {
-moz-box-shadow: 0px 0px 10px Green;
-webkit-box-shadow: 0px 0px 10px Green;
box-shadow: 0px 0px 10px Green;
}

За @ Имода

Это работает для всех типов ввода текста 

input[type='text'] {
  -moz-box-shadow: 0px 0px 4px #ffffff;
  -webkit-box-shadow: 0px 0px 4px #ffffff;
  box-shadow: 0px 0px 4px #ffffff;
}

А чтобы получить его только при наведении: 

input[type='text']:hover {
  -moz-box-shadow: 0px 0px 4px #ffffff;
  -webkit-box-shadow: 0px 0px 4px #ffffff;
  box-shadow: 0px 0px 4px #ffffff;
}
0 голосов
/ 03 августа 2011

Это выберет ваши входные данные, которые имеют тип «текст».Затем измените #FFFFFF на любой другой цвет.Теоретически это должно работать.Если это не так, добавьте inset непосредственно после каждого двоеточия.Это не точная outer-glow репликация, но я считаю, что она подойдет вам. 


input[type='text'] {
  -moz-box-shadow: 0px 0px 4px #ffffff;
  -webkit-box-shadow: 0px 0px 4px #ffffff;
  box-shadow: 0px 0px 4px #ffffff;
}
0 голосов
/ 03 августа 2011

Вы можете создавать объекты или графические объекты в Photoshop или Fireworks, а затем импортировать эту графику в свою разработку с помощью файла CSS.Пример: 

div#btn {
background-position: top right;
position:absolute; */
margin:0px 0px; padding:0px;
text-align:center;
background-image: url(images/bg1.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
}

Затем в своем HTML просто вызовите этот div на своей кнопке.

...