当前位置:Gxlcms > 前端框架 > html怎么设置button大小及颜色

html怎么设置button大小及颜色

时间:2021-07-01 10:21:17 帮助过:1195人阅读

html中可以使用width和height属性来设置button的大小,使用background-color属性来颜色,具体语法为“button{width:宽度值;height:高度值;background-color: 颜色值;}”。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

HTML <button> 标签

<button> 标签定义一个按钮。

在 <button> 元素内部,您可以放置内容,比如文本或图像。这是该元素与使用 <input> 元素创建的按钮之间的不同之处。

html设置button大小及颜色

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<style type="text/css">
			button{
				width:100px;
				height: 100px;
				background-color: palevioletred;
			}
		</style>
	</head>

	<body>

		<button type="button" onclick="alert('你好,世界!')">点我!</button>

	</body>

</html>

效果图:

1.png

【推荐教程:CSS视频教程 】

css width和height属性

width属性设置元素的宽度。

height属性设置元素的高度。

描述
auto默认值。浏览器可计算出实际的宽度或高度。
length使用 px、cm 等单位定义宽度或高度。
%定义基于包含块(父元素)宽度的百分比宽度或高度。

CSS background-color 属性

background-color属性设置一个元素的背景颜色。

描述
color指定背景颜色。
transparent指定背景颜色应该是透明的。这是默认

更多编程相关知识,请访问:编程视频!!

以上就是html怎么设置button大小及颜色的详细内容,更多请关注gxlcms其它相关文章!

人气教程排行