<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.fly-search {
position: relative;
margin-left: 10px;
display: inline-block;
vertical-align: top;
}
.fly-search input {
padding-right: 30px;
}
.layui-input {
display: block;
width: 100%;
padding-left: 10px;
}
.layui-input{
height: 38px;
line-height: 38px;
border: 1px solid #e6e6e6;
background-color: #fff;
border-radius: 2px;
box-sizing: border-box!important;---div 設置的寬高將包含 邊框及 padding
}
</style>
//引用圖標字體
<link rel="stylesheet" href="../res/css/global.css">
</head>
<body>
<form action="http://cn.bing.com/search" class="fly-search">
<i class="iconfont icon-sousuo"></i>
<input class="layui-input" autocomplete="off" placeholder="搜索內容，回車跳轉" type="text" name="q">
</form>
</body>
</html>
效果：
