二级搜索框 html,输入搜索框美化2.html

.search-form {

position: relative;

width: 300px;

margin: 0 auto;

}

input, button {

border: none;

outline: none;

}

input {

width: 100%;

height: 42px;

padding-left: 13px;

}

button {

height: 42px;

width: 42px;

cursor: pointer;

position: absolute;

}

/*搜索框3*/

.bar3 {background: #F9F0DA;}

.bar3 .search-form {background: #A3D0C3;}

.bar3 input, .bar3 button {

background: transparent;

}

.bar3 button {

top: 0;

right: 0;

}

.bar3 button:before {

content: "\f002";

font-family: FontAwesome;

font-size: 16px;

color: #F9F0DA;

}

一键复制

编辑

Web IDE

原始数据

按行查看

历史