Ale*_*lex 5 css browser input colors background-color
所以看看这些按钮:
他们没有风格,看起来很不错(第二个是鼠标悬停).
我可以以某种方式保持他们的外观,但改变背景颜色?
如果我通过CSS的background-color
属性这样做我得到这个:
哪个看起来不像其他的(它不是圆形的,颜色是平的,没有内部发光)......
每个浏览器都有自己的样式.但是使用css你可以实现它.检查以下内容:
input {-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.16, rgb(207,207,207)),
color-stop(0.79, rgb(252,252,252))
);
background-image: -moz-linear-gradient(
center bottom,
rgb(207,207,207) 16%,
rgb(252,252,252) 79%
);
padding:3px;
border:1px solid #000;}
Run Code Online (Sandbox Code Playgroud)
:hover
来自@xec在评论中发布的伟大网站的css按钮的更新版本和渐变.
演示: http ://jsfiddle.net/Ekf5b/1
有用的梯度发生器:http://gradients.glrzad.com/
一些附加信息:第一步是添加圆角.要设置圆角,即可以使用css3pie.然后使用任何引用的工具添加渐变.最后我添加padding
了显而易见的原因,并border
覆盖浏览器的默认值.