* { margin: 0; padding: 0; } .content { overflow: hidden; background-color: #f2f8fc; } .search-box { width: 1200px; height: 108px; margin: 20px auto; background-color: #00000017; display: flex; align-items: center; } .search-type { width: 288px; height: 60px; margin-left: 20px; } .name { height: 30px; line-height: 30px; font-size: 14px; color: #444; } .type { height: 30px; display: flex; background-color: #eee; } .type>div { width: 112px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #888; } .type>div:nth-child(1) { width: 64px; } .type>div:hover { cursor: pointer; } .type-item { background-color: #a6a6a6; color: #000 !important; } .search-name { width: 200px; height: 60px; margin-left: 30px; } #name { height: 30px; border-radius: 0; box-shadow: none; border: 0; } .search { width: 68px; height: 30px; background-color: #1b61ac; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 14px; } .search:hover { cursor: pointer; background-color: #286090; } .search:active { background-color: #204d74; } .content-box { width: 1200px; margin: 0 auto; padding: 20px 19px; background-color: #fff; border: 1px solid #eee; margin-bottom: 30px; } .main-cent { /* height: 870px; */ display: flex; flex-wrap: wrap; align-content: start; } .main-cent-item { width: 275px; /* height: 425px; */ margin-bottom: 20px; } .main-cent-item:hover { cursor: pointer; } .item-top { width: 275px; height: 275px; position: relative; } .item-top>img { width: 100%; height: 100%; } .item-date { position: absolute; top: 0; right: 0; width: 90px; height: 25px; background-color: #606060; opacity: 0.84; color: #fbfbfb; font-size: 15px; display: flex; align-items: center; justify-content: center; } .item-img { position: absolute; bottom: 0; width: 100%; height: 50px; background-color: #5b5b5b; opacity: 0.84; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; } .item-img>div:nth-child(1) { height: 50px; line-height: 50px; width: 225px; overflow: hidden; font-size: 16px; color: #ffffff; } .item-img>div:nth-child(2) { font-size: 13px; color: #ff6060; } .item-bottom { /* height: 150px; */ padding: 0 10px; padding-top: 10px; background-color: #f2f2f2; } .item-text { font-size: 13px; color: #737373; line-height: 22px; display: flex; } .isli-text { width: 164px; color: #737373; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .isli-text:hover { color: #737373; } .item-cart { height: 41px; border-top: 1px solid #ccc; margin-top: 33px; display: flex; align-items: center; justify-content: space-between; padding: 0 3px; font-size: 15px; } .item-cart>div:nth-child(1) { color: #4c0000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .item-cart>div:nth-child(2) { color: #ac0000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } /* 外面盒子样式---自己定义 */ .page_div { margin-top: 20px; color: #666; text-align: right; } /* 页数按钮样式 */ .page_div button { display: inline-block; min-width: 30px; height: 28px; cursor: pointer; color: #666; font-size: 13px; line-height: 28px; background-color: #f9f9f9; border: 1px solid #dce0e0; text-align: center; margin: 0 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* 单页数据选择框样式 */ #page-sizes { display: inline-block; min-width: 80px; height: 28px; cursor: pointer; color: #0073A9; font-size: 13px; line-height: 28px; background-color: #f9f9f9; border: 1px solid #0073A9; text-align: center; margin: 0 4px; border-radius: 0; } #page-sizes:focus-visible { outline: -webkit-focus-ring-color auto 0; } #text { width: 50px; height: 29px; color: #666; text-align: center; border: 1px solid #0073A9; } #firstPage, #lastPage, #nextPage, #prePage { width: 50px; color: #0073A9; border: 1px solid #0073A9; } #nextPage, #prePage { width: 70px; } .page_div .current { background-color: #0073A9; border-color: #0073A9; color: #FFF; } /* 页面数量 */ .totalPages { margin: 0 10px; } .totalPages span, .totalSize span { color: #0073A9; margin: 0 5px; } /*button禁用*/ .page_div button:disabled { opacity: .5; cursor: no-drop; }