帮我写一个好看的按钮html代码
时间: 2023-03-13 19:00:49 浏览: 182
<button style="background-color:#4CAF50;border:none;color:white;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:4px 2px;cursor:pointer;">这是一个好看的按钮</button>
相关问题
帮我写一个html按钮
好的,下面是一个简单的HTML按钮的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>按钮示例</title>
<style>
button {
background-color: blue;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
button:hover {
background-color: darkblue;
}
</style>
</head>
<body>
<button>点击这里</button>
</body>
</html>
```
代码中使用了HTML和CSS实现了一个简单的按钮。按钮的样式通过CSS设置,包括背景颜色、文字颜色、内边距、边框、圆角、字体大小和指针形状。当鼠标悬停在按钮上时,通过:hover伪类实现了背景颜色的变化。在HTML中通过<button>标签创建了按钮元素,按钮上的文字可以在<button>和</button>之间设置。
帮我写一个HTML打车代码
好的,以下是一个简单的HTML打车代码:
```
<!DOCTYPE html>
<html>
<head>
<title>打车</title>
</head>
<body>
<h1>打车服务</h1>
<form action="submit.php" method="post">
<label for="start">起点:</label>
<input type="text" id="start" name="start"><br><br>
<label for="destination">目的地:</label>
<input type="text" id="destination" name="destination"><br><br>
<label for="name">姓名:</label>
<input type="text" id="name" name="name"><br><br>
<label for="phone">电话:</label>
<input type="tel" id="phone" name="phone" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" placeholder="格式:xxx-xxx-xxxx"><br><br>
<input type="submit" value="提交">
</form>
</body>
</html>
```
在这个代码中,我们使用了一个简单的表单,包含了以下几个字段:
- 起点(输入框)
- 目的地(输入框)
- 姓名(输入框)
- 电话(输入框,需要满足特定的格式)
- 提交按钮
当用户填写完表单并点击提交按钮后,表单数据会被提交到服务器上的submit.php文件进行处理。你需要根据自己的需求修改submit.php文件的内容,来实现打车服务的具体功能。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![text/html](https://img-home.csdnimg.cn/images/20210720083451.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)