.header { width: 100%; position: fixed; left: 0; top: 0; height: 56px; background: #fff; z-index: 9999; box-shadow: 0 2px 10px rgba(0,0,0,.05); } .center { width: 1440px; margin: 0 auto; } .center_logo { padding-top: 12px; } .center_logo img { width: 60px; height: 30px; } .center_menu { margin-left: 204px; } .center_menu ul li { line-height: 56px; height: 56px; padding: 0 20px; } .center_menu ul li a { font-size: 17px; color: #333; } .center_menu ul li input[type="text"] { width: 160px; height: 36px; border: none; padding: 8px 36px 8px 16px; box-sizing: border-box; border-radius: 18px; background: #f2f2f2 url("../img/search.png"); background-repeat: no-repeat; background-size: 21px 21px; background-position: 124px center; transition: all ease 1s; } .center_menu ul li input[type="text"]:focus { width: 300px; background-position: 264px center; } .center_login {} .center_login ul li:first-child img{ padding-top: 17px; width: 24px; height: 24px; margin-right: 12px; } .center_login ul li:nth-child(2) img{ padding-top: 18px; width: 56px; height: 24px; margin-right: 10px; } .center_login ul li:nth-child(3) a{ padding: 0 16px; color: #969696; } .center_login ul li:nth-child(4) a{ width: 82px; height: 40px; border-radius: 50px; background-color: #fff; font-size: 16px; color: #ec7259; margin-right: 8px; border: 1px solid #ec7259; text-align: center; line-height: 40px; display: block; box-sizing: border-box; margin-top: 7px; } .center_login ul li:nth-child(5) img { width: 16px; height: 16px; vertical-align: middle; } .center_login ul li:nth-child(5) a{ width: 108px; height: 40px; border-radius: 50px; background-color: #ec7259; font-size: 16px; color: #fff; margin-right: 8px; text-align: center; line-height: 40px; display: block; margin-top: 7px; } .center_login ul li { height: 56px; line-height: 56px; } .center_login ul li, .center_menu ul li { float: left; }