爲輸入框和按鈕添加發光效果

Question

我正在製作我的html表單，並且我想添加效果。

<input name="" type="text" class="" />有可能發光效果？

提交按鈕也有可能產生這種效果嗎？

Answer 1

這適用於類按鈕的所有輸入

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

每@Imoda

這適用於類型的文本

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; 
} 

Answer 2

您可以通過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。

Answer 3

這將選擇您的輸入是「文本」類型。然後將#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; 
}