web怎么做?
导读:这 里是一个示例 .bod1 /*background: -webkit-linear-gradient(to right, #f7797d, #FBD786, #C6FFDD ;*/ /*background-image: url("...
这 里是一个示例
.bod1
/*background: -webkit-linear-gradient(to right, #f7797d, #FBD786, #C6FFDD);
*/
/*background-image: url(" 2558.jpg");
*/
/*background-size:cover;
*/
background: #aa4b6b;
/* fallback for old browsers */
background: -webkit-linear-gradient(to right, #3b8d99, #6b6b83, #aa4b6b);
/* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #3b8d99, #6b6b83, #aa4b6b);
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
.search-box
position: absolute;
top: 50%;
left: 50%;
transform: translate( -50%,-50%);
background: #FD2C6B;
height: 40px;
border-radius: 30px;
/*圆角边框*/
padding: 10px;
.search-box:hover>
.search-text
width: 400px;
.search-box:hover>
.search-btn
background: white;
color: #26087b;
.search-btn
color: white;
float: right;
width: 40px;
height: 40px;
border-radius: 50%;
background:#FD2C6B;
display: flex;
justify-content: center;
align-items: center;
transition: 0.5s;
.search-text
border: none;
background: none;
outline: none;
float: left;
padding: 0;
color: white;
font-size: 20px;
font-family: "Microsoft YaHei UI Light";
transition: 0.5s;
line-height:40px;
width: 0px;
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: web怎么做?
本文地址: https://pptw.com/jishu/667838.html
