在网页设计中,搜索框是一个非常常见的元素,它可以让用户方便地搜索内容。在CSS中,我们可以使用一些简单的代码来添加一个搜索框。首先,我们需要在HTML代码中添加一个输入框和一个按钮。比如:&l
<form> <input type="text" placeholder="Search..."> <button type="submit">搜索</button> </form>
input[type="text"] { padding: 10px; border: none; border-radius: 20px; outline: none; } button[type="submit"] { padding: 10px 20px; background-color: #4CAF50; color: white; border: none; border-radius: 20px; cursor: pointer; }
<div class="search-container"> <form> <input type="text" placeholder="Search..."> <button type="submit">搜索</button> </form> </div> .search-container input[type="text"] { /* 输入框的样式 */ } .search-container button[type="submit"] { /* 按钮的样式 */ }
粉丝
0
关注
0
收藏
0