* { margin: 0; padding: 0; } body, html { background: #f6f8f9; color: #333; font-size: 14px; } .downbox { width: 1201px; margin: auto; } .title { width: 100%; height: 80px; border: 1px solid #cccccc; background: #e3e4e5; margin-top: 35px; display: flex; align-items: center; box-sizing: border-box; padding-left: 20px; } .title>div { border-left: 4px solid #ff6e17; font-size: 18px; color: #333; text-indent: 10px; font-weight: bold; } .content { width: 100%; border-left: 1px solid #ccc; box-sizing: border-box; /*overflow: hidden;*/ } .content *{ box-sizing: border-box; } .inner { width: 400px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; box-sizing: border-box; padding: 40px; display: inline-block; cursor: pointer; background-color: white; } .innera { display: flex; } .innera_left { width: 55px; height: 55px; display: flex; align-items: center; } .innera_right>div:nth-child(1) { font-size: 18px; color: #333; text-indent: 10px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .innera_right>div:nth-child(2) { font-size: 12px; color: #666; text-indent: 10px; } .innerb { font-size: 15px; color: #666; width: 100%; box-sizing: border-box; padding-top: 25px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .innerc { display: flex; align-items: center; justify-content: flex-end; box-sizing: border-box; padding-top: 20px; } .innerc>div:nth-child(1) { width: 95px; border: 1px solid #2887df; box-sizing: border-box; padding: 5px 0; display: flex; align-items: center; justify-content: center; } .innerc>div:nth-child(1):hover{ box-shadow: 0 0 5px #2887df inset; } .innerc>div:nth-child(2) { border: 1px solid #f79767; width: 95px; box-sizing: border-box; padding: 5px 0; margin-left: 10px; display: flex; align-items: center; justify-content: center; } .innerc>div:nth-child(2):hover{ box-shadow: 0 0 5px #f79767 inset; } .carouselBox{ display: none; box-sizing: border-box; padding: 10px; }