关于<input type="button" value="搜索">默认样式的清除

吐泡泡的铁憨憨

于 2017-05-30 20:26:08 发布

阅读量7.9k

点赞数 4

分类专栏： CSS

本文链接：https://blog.youkuaiyun.com/qq_38275944/article/details/72811446

版权

CSS 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何通过CSS清除HTML中input元素的默认样式，并展示了一个具体的例子，即将按钮背景设为橙色，边框设为0像素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天在写搜索框的时候，用到了input。由于整体美观的考虑需要清除它的默认样式，改成自己想要的。

先来看看没有清除前的样式。

代码如下：

<!DOCTYPE html>
<html>
<head>
	<title>input默认样式清除</title>
	<meta charset="utf-8">
</head>
<body>
<input type="button" value="搜索">
</body>
</html>

经过一段时间的研究，来看看清除后的自己想要的样子吧。

清除后的样子是不是很好看，话不多说，直接上硬菜。

<!DOCTYPE html>
<html>
<head>
	<title>input默认样式清除</title>
	<meta charset="utf-8">
	<style type="text/css">
		input{
			background: #FF6805;
			border:0px;
			height:30px;
			width:50px;
		}
	</style>
</head>
<body>
<input type="button" value="搜索">
</body>
</html>

最后祝大家端午节快乐，233333333333333333