用html写一个百度搜索框(要求有html和css)
时间: 2024-10-28 21:10:42 浏览: 121
当然可以。要在HTML中创建一个简单的百度搜索框,你可以使用`<form>`标签结合`<input>`标签来构建,并配合一些基本CSS样式美化。下面是一个简单的例子:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<style>
.search-container {
width: 300px;
margin: 0 auto;
padding: 15px;
border: 1px solid #ccc;
border-radius: 4px;
}
input[type="text"] {
width: 100%;
height: 35px;
padding: 5px;
font-size: 16px;
box-sizing: border-box;
border: none;
outline: none;
background-color: #f2f2f2;
}
button {
width: 100%;
height: 40px;
background-color: #0099ff;
color: white;
border: none;
cursor: pointer;
font-size: 16px;
}
button:hover {
background-color: #0077cc;
}
</style>
</head>
<body>
<div class="search-container">
<h2>百度搜索</h2>
<form action="https://www.baidu.com/s" method="get">
<input type="text" name="wd" placeholder="请输入关键词...">
<button type="submit">搜索</button>
</form>
</div>
</body>
</html>
```
这个代码包含了一个标题、一个输入框用于键入搜索词,以及一个提交按钮。用户可以在输入框中输入并点击提交到百度进行搜索。
阅读全文