* { margin: 0; padding: 0; } .banner { width: 100%; height: 400px; } .banner-wrapper { position: relative; overflow: hidden; width: 100%; height: 100%; } .banner-list { width: 100%; height: 100%; position: absolute; display: flex; top: 0; left: 0; } .punctuation { position: absolute; width: 100%; height: 35px; /* background-color: red; */ bottom: 40px; } .punct_box { height: 35px; margin: 0 auto; display: flex; /* background-color: #206CCF; */ } .punct_item { width: 80px; height: 35px; background-color: #000; opacity: 0.72; cursor: pointer; } .punct_item2 { margin-right: 20px; } .punct_item3 { background-color: #fff; } .store_deailsbox { width: 100%; background: #F2F8FC; overflow: hidden; } .detisl_head { width: 1200px; height: 180px; margin: 30px auto; /* background: white; */ display: flex; padding: 0 20px; } .head_left { width: 30%; height: 180px; } .head_left img { width: 100%; height: 100%; object-fit: contain; } .head_right { width: 70%; height: 180px; margin-left: 20px; display: flex; } .con_box_left,.con_box_right { width: 50%; } .con_box { display: flex; height: 40px; line-height: 40px; font-size: 14px; border: 1px solid #d7d7d7; border-collapse: collapse; } .title_two { width: 40%; text-align: center; padding-right: 5px; border-right: 1px solid #d7d7d7; border-collapse: collapse; } .content_two { width: 60%; border-collapse: collapse; padding: 0 0 0 15px; margin-right: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .search_header { width: 1200px; height: 100px; margin: 0px auto; background: white; } .search_header .search_box { padding: 40px; display: flex; justify-content: space-evenly; } .search_header .search_box div .iptword { width: 190px; height: 30px; margin-left: 20px; border: 1px solid #dddddd; } .search_header .search_box div .select { width: 140px; height: 30px; border: 1px solid #dddddd; margin-left: 20px; outline: none; } .search_header .search_box div .select1 { width: 140px; height: 30px; border: 1px solid #dddddd; margin-left: 20px; outline: none; } .search_header .search_box .btn3, .btn4 { width: 68px; height: 30px; margin-left: 20px; outline: none; border: none; color: white; background-color: rgba(62, 71, 97, 1); } /* 内容样式 */ .main_table { width: 1200px; margin: 20px auto; padding: 20px 0; background-color: #fff; margin-bottom: 30px; } .main_table #main_cent { display: flex; flex-wrap: wrap; padding: 0 20px; } .main_table #main_cent .main_mook { width: 265px; height: 420px; cursor: pointer; margin: 10px 0 0 33px; } .main_table #main_cent .main_mook .mook_head { position: relative; } .main_table #main_cent .main_mook:nth-child(1) { margin-left: 0px; } .main_table #main_cent .main_mook:nth-child(4n+1) { margin-left: 0px; } .main_table #main_cent .main_mook .mook_head .tig_head { position: absolute; height: 25px; left: 188px; top: 0; background-color: rgba(0, 0, 0, 0.6); color: white; font-size: 14px; text-align: center; line-height: 25px; } .main_table #main_cent .main_mook .mook_head .tig_bottom { position: absolute; width: 265px; height: 50px; left: 0; top: 220px; background-color: rgba(0, 0, 0, 0.6); color: white; line-height: 50px; display: flex; font-size: 16px; justify-content: space-between; padding: 0 10px; } .main_table #main_cent .main_mook .mook_head .tig_bottom .tig_botm1 { width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .main_table #main_cent .main_mook .mook_head img { width: 265px; height: 270px; /* object-fit: contain; */ } #main_cent .main_mook .mook_men { width: 265px; height: 125px; background-color: rgba(242, 242, 242, 1); } #main_cent .main_mook .mook_men p { width: 245px; font-size: 13px; color: #737373; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 10px; } #main_cent .main_mook .mook_men .bor { width: 245px; border: 1px solid #CCCCCC; margin: 5px 0 0 10px; line-height: 1px; background-color: #CCCCCC; } #main_cent .main_mook .mook_men .men_bott { display: flex; justify-content: space-around; font-size: 15px; padding: 0 10px; } #main_cent .main_mook .mook_men .men_bott div { margin-top: 7px; } #main_cent .main_mook .mook_men .men_bott .men_name { color: #4C0000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .setPageDiv { width: 1100px; margin: auto; margin-bottom: 91px; margin-top: 37px; } #pagination { margin: auto; margin-left: 100px; text-align: right; } /* 外面盒子样式---自己定义 */ .page_div { margin-top: 20px; color: #666; text-align: right; padding: 0 26px 0 0; } /* 页数按钮样式 */ .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; }