1 line
14 KiB
CSS
1 line
14 KiB
CSS
|
.blog_container{padding-top:158px}.blog_container>header{background:linear-gradient(180deg, #FFFFFF 0%, #F4F4F4 100%);margin:0 20px;padding-bottom:40px;box-sizing:border-box;border-radius:16px}.blog_container>header>.h_recommend{max-width:1200px;width:100%;margin:0 auto;display:flex;justify-content:center;column-gap:20px;flex-wrap:wrap}.blog_container>header>.h_recommend:hover>div:nth-of-type(2)>h1{color:#8062EF}.blog_container>header>.h_recommend>div:nth-of-type(1)>img{width:590px;height:220px;transition:all .3s}.blog_container>header>.h_recommend>div:nth-of-type(2){max-width:589px;width:100%;display:flex;flex-direction:column;justify-content:space-between;padding-bottom:10px;row-gap:12px}.blog_container>header>.h_recommend>div:nth-of-type(2)>h1{font-weight:bold;font-size:24px;color:#000000;line-height:34px;transition:all .3s}.blog_container>header>.h_recommend>div:nth-of-type(2)>p{font-size:16px;color:#999999;line-height:24px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.blog_container>header>.h_recommend>div:nth-of-type(2)>div{display:flex;align-items:center;justify-content:space-between;margin-top:auto}.blog_container>header>.h_recommend>div:nth-of-type(2)>div>p{display:flex;align-items:center;column-gap:9px}.blog_container>header>.h_recommend>div:nth-of-type(2)>div>p>span{font-weight:bold;font-size:16px;color:#333333}.blog_container>header>.h_recommend>div:nth-of-type(2)>div>p>img{width:32px;height:32px;border-radius:100%}.blog_container>header>.h_recommend>div:nth-of-type(2)>div>span{font-size:14px;color:#999999;line-height:21px}.blog_container>header>.h_demo{max-width:1200px;width:100%;margin:0 auto;display:flex;align-items:center;margin-top:20px;gap:20px;justify-content:center;flex-wrap:wrap}.blog_container>header>.h_demo>a{flex:1;transition:all .3s}.blog_container>header>.h_demo>a:hover>h2{color:#8062EF}.blog_container>header>.h_demo>a>img{width:100%;height:142px;margin-bottom:12px;transition:all .3s}.blog_container>header>.h_demo>a>h2{font-weight:bold;font-size:20px;color:#000000;line-height:28px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:12px;transition:all .3s;height:60px}.blog_container>header>.h_demo>a>div{display:flex;align-items:center;gap:4px}.blog_container>header>.h_demo>a>div>img{width:32px;height:32px;border-radius:100%}.blog_container>header>.h_demo>a>div>p{display:flex;flex-direction:column}.blog_container>header>.h_demo>a>div>p>span:nth-of-type(1){font-weight:bold;font-size:14px;color:#333333;line-height:21px}.blog_container>header>.h_demo>a>div>p>span:nth-of-type(2){font-size:14px;color:#999999;line-height:21px}.blog_container>.blog_type{max-width:1200px;width:100%;margin:0 auto;margin-top:24px}.blog_container>.blog_type>ul{display:flex;align-items:center;margin-bottom:24px;gap:8px}.blog_container>.blog_type>ul>li{padding:0 14px;height:42px;background:#FFFFFF;border-radius:29px 29px 29px 29px;border:1px solid #CBCBCB;font-size:16px;color:#333333;line-height:42px;cursor:pointer;white-space:nowrap}.blog_container>.blog_type>ul>li.active{background:#171717;border:1px solid #FFFFFF;color:#FFFFFF}.blog_container>.blog_type>ul>li.active>a{color:#FFFFFF}.blog_container>.blog_type>.type_container{display:flex;justify-content:center;gap:20px;padding-bottom:64px;flex-wrap:wrap}.blog_container>.blog_type>.type_container>.article_container{display:flex;flex-direction:column;gap:20px;width:100%}.blog_container>.blog_type>.type_container>.article_container>a:not(.page){padding-bottom:20px;transition:all .3s;display:flex;gap:21px;max-width:1200px;justify-content:space-between;width:100%;flex-wrap:wrap}.blog_container>.blog_type>.type_container>.article_container>a:not(.page):not(:last-child){border-bottom:1px solid #CBCBCB}.blog_container>.blog_type>.type_container>.article_container>a:not(.page):hover>div>h2{color:#8062EF}.blog_container>.blog_type>.type_container>.article_container>a:not(.page):hover>img{transform:scale(1.1)}.blog_container>.blog_type>.type_containe
|