theluyuan/webveuje
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

float

Browse Source
This commit is contained in:
asd
2021-01-20 11:25:18 +08:00
parent 9853dbdd91
commit b8df71627e
21 changed files with 917 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
csspress/demo/search1.html Normal file
View File

@@ -0,0 +1,87 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{
margin:0;
padding: 0;
}
.box{
width: 640px;
}
.search{
width: 576px;
height:32px;
border: 2px solid #e2231a;
}
.searchcontent{
width: 500px;
height:28px;
padding-left: 15px;
font-size: 15px;
outline: none;
border: none;
}
.searchcontent:focus{
outline: none;
}
.tuijian{
width: 586px;
/* height:200px; */
background: white;
border: 1px solid #ccc;
position: relative;
top:5px;
left: -10px;
}
.tuijianitem{
width:586px;
height: 25px;
cursor: default;
/* border: 1px solid #ccc; */
font-size: 12px;
padding-left: 15px;
box-sizing: border-box;
}
.tuijianitem:hover{
background: #ccc;
}
.btn{
width: 60px;
height: 30px;
background-color: #e2231a;
color: white;
text-align: center;
line-height: 30px;
float: right;
position: relative;
top: -35px;
left:20px;
}
</style>
</head>
<body>
<div class="box">
<div class="left">
<div class="search">
<input type="text" class="searchcontent">
<ul class="tuijian">
<li class="tuijianitem">中华老字号</li>
<li class="tuijianitem">营养零食</li>
<li class="tuijianitem">休闲零食</li>
<li class="tuijianitem">鲜花</li>
<li class="tuijianitem">永生花</li>
<li class="tuijianitem">鼠尾草</li>
</ul>
</div>
<div class="btn">搜索</div>
</div>
<div>会员</div>
</body>
</html>