【B2美化】会员展示模块

【B2美化】会员展示模块插图

主题设置-首页-添加模块-调用内容:自定义

<link rel="stylesheet" href="https://www.ahap.cn/rz-image/style.css" type="text/css" media="all">

<link rel="stylesheet" href="https://www.ahap.cn/wp-content/themes/b2/Assets/fontend/style.css" type="text/css" media="all">

<div class="demo">
  <div class="container">
    <div class="row">
      <div class="col-sm-6">
        <div class="our-team b2-radius">
          <div class="pic"><img
              data-src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153722476.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              
              src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153722476.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              class="lazy"></div>
          <div class="i-content">
            <div class="user-s-info-name">
              <h3 class="title">胡哥</h3>
              <p><span class="lv-icon user-lv b2-lv0"><b><span class="lv-icon user-vip b2-vip3"><i
                        style="border-color: rgb(30, 115, 190);"></i><b
                        style="color: rgb(30, 115, 190);">终身会员</b></span></b> <span
                    class="lv-icon user-lv b2-lv7"><b>设计总监</b><i>lv7</i></span></span></p>
            </div>
            <div class="user-s-data">
              <div><span>文章</span>
                <p>214</p>
              </div>
              <div><span>评论</span>
                <p>1</p>
              </div>
              <div><span>粉丝</span>
                <p>2</p>
              </div>
              <div><span>关注</span>
                <p>0</p>
              </div>
            </div>
            <div class="user-s-info-desc">
              这个人很懒,什么都没有留下!
            </div>
          </div>
          <ul class="social">
            <div class="user-s-follow"><a href="https://www.onecad.cn/users/1" class="link-block">个人主页</a></div>
          </ul>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="our-team b2-radius">
          <div class="pic"><img
              data-src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153748481.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              
              src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153748481.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              class="lazy"></div>
          <div class="i-content">
            <div class="user-s-info-name">
              <h3 class="title">HXP室内设计</h3>
              <p><span class="lv-icon user-lv b2-lv0"><b><span class="lv-icon user-vip b2-vip2"><i
                        style="border-color: rgb(129, 215, 66);"></i><b
                        style="color: rgb(129, 215, 66);">年卡会员</b></span></b> <span
                    class="lv-icon user-lv b2-lv1"><b>助理设计</b><i>lv1</i></span></span></p>
            </div>
            <div class="user-s-data">
              <div><span>文章</span>
                <p>0</p>
              </div>
              <div><span>评论</span>
                <p>2</p>
              </div>
              <div><span>粉丝</span>
                <p>1</p>
              </div>
              <div><span>关注</span>
                <p>0</p>
              </div>
            </div>
            <div class="user-s-info-desc">
              室内设计,图纸深化设计
            </div>
          </div>
          <ul class="social">
            <div class="user-s-follow"><a href="https://www.onecad.cn/users/2" class="link-block">个人主页</a></div>
          </ul>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="our-team b2-radius">
          <div class="pic"><img
              data-src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153914348.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              
              src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153914348.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              class="lazy"></div>
          <div class="i-content">
            <div class="user-s-info-name">
              <h3 class="title">芭蕉</h3>
              <p><span class="lv-icon user-lv b2-lv0"><b><span class="lv-icon user-vip b2-vip2"><i
                        style="border-color: rgb(129, 215, 66);"></i><b
                        style="color: rgb(129, 215, 66);">年卡会员</b></span></b> <span
                    class="lv-icon user-lv b2-lv0"><b>实习设计</b><i>lv0</i></span></span></p>
            </div>
            <div class="user-s-data">
              <div><span>文章</span>
                <p>0</p>
              </div>
              <div><span>评论</span>
                <p>2</p>
              </div>
              <div><span>粉丝</span>
                <p>0</p>
              </div>
              <div><span>关注</span>
                <p>0</p>
              </div>
            </div>
            <div class="user-s-info-desc">
              这个人很懒,什么都没有留下!
            </div>
          </div>
          <ul class="social">
            <div class="user-s-follow"><a href="https://www.onecad.cn/users/21" class="link-block">个人主页</a></div>
          </ul>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="our-team b2-radius">
          <div class="pic"><img
              data-src="https://img.onecad.cn/wp-content/uploads/2022/01/20220108072334884.jpg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              
              src="https://img.onecad.cn/wp-content/uploads/2022/01/20220108072334884.jpg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              class="lazy"></div>
          <div class="i-content">
            <div class="user-s-info-name">
              <h3 class="title">隔壁老王</h3>
              <p><span class="lv-icon user-lv b2-lv0"><b></b> <span
                    class="lv-icon user-lv b2-lv0"><b>实习设计</b><i>lv0</i></span></span></p>
            </div>
            <div class="user-s-data">
              <div><span>文章</span>
                <p>0</p>
              </div>
              <div><span>评论</span>
                <p>0</p>
              </div>
              <div><span>粉丝</span>
                <p>2</p>
              </div>
              <div><span>关注</span>
                <p>0</p>
              </div>
            </div>
            <div class="user-s-info-desc">
              这个人很懒,什么都没有留下!
            </div>
          </div>
          <ul class="social">
            <div class="user-s-follow"><a href="https://www.onecad.cn/users/35" class="link-block">个人主页</a></div>
          </ul>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="our-team b2-radius">
          <div class="pic"><img
              data-src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153829187.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              
              src="https://img.onecad.cn/wp-content/uploads/2022/01/20220119153829187.jpeg?x-oss-process=image/resize,m_fill,h_192,w_192/sharpen,120"
              class="lazy"></div>
          <div class="i-content">
            <div class="user-s-info-name">
              <h3 class="title">kokoko</h3>
              <p><span class="lv-icon user-lv b2-lv0"><b></b> <span
                    class="lv-icon user-lv b2-lv0"><b>实习设计</b><i>lv0</i></span></span></p>
            </div>
            <div class="user-s-data">
              <div><span>文章</span>
                <p>0</p>
              </div>
              <div><span>评论</span>
                <p>0</p>
              </div>
              <div><span>粉丝</span>
                <p>1</p>
              </div>
              <div><span>关注</span>
                <p>0</p>
              </div>
            </div>
            <div class="user-s-info-desc">
              这个人很懒,什么都没有留下!
            </div>
          </div>
          <ul class="social">
            <div class="user-s-follow"><a href="https://www.onecad.cn/users/45" class="link-block">个人主页</a></div>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>

样式CSS代码放入主题目录的style.css或 外观-自定义-额外CSS

.demo {
  padding-bottom: 2em;
}

.our-team {
  padding: 20px 0 0px;
  background: #ffffff;
  text-align: center;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.demo .user-s-info-name {
    margin-top: 0px;
    display: flex;
    flex-flow: column;
    margin-left: 0px;
}
.demo .user-s-info-desc {
    font-size: 13px;
    margin-top: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    width: 100%;
    background: #ffffff;
    padding: 10px;
    color: #bcbcbc;
    height: 62px;
    line-height: 35px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #f3f3f3;
    border-bottom: 1px solid #f3f3f3;
}
.our-team .pic {
  display: inline-block;
  width: 130px;
  height: 130px;
  margin-bottom: 10px;
  z-index: 1;
  position: relative;
}

.our-team .pic:before {
  content: "";
  width: 100%;
  height: 0;
  border-radius: 50%;
  background: #ff3a55;
  position: absolute;
  bottom: 135%;
  right: 0;
  left: 0;
  opacity: 1;
  transform: scale(3);
  transition: all 0.3s linear 0s;
}

.our-team:hover .pic:before {
  height: 100%;
}

.our-team .pic:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #ff3a55;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 24px;
}

.col-sm-6 {
  cursor: pointer;
  width: calc(20% - 12px);
  border-radius: 4px;
  background-size: 100% 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 768px){
.col-sm-6 {
    width: calc(50% - 12px);
}
}
@media screen and (max-width: 500px){
.col-sm-6 {
    width:100%;
}
}
.our-team .pic img {
  width: 100%;
  height: auto;
  border-radius: 50%;
  transform: scale(1);
  transition: all 0.9s ease 0s;
}

.our-team:hover .pic img {
    box-shadow: 0 0 0 8px #f7f5ec;
    transform: scale(0.8);
}

.our-team .team-content {
  margin-bottom: 30px;
}

.our-team .title {
  font-size: 22px;
  font-weight: 700;
  color: #4e5052;
  letter-spacing: 1px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.our-team .post {
  display: block;
  font-size: 15px;
  color: #4e5052;
  text-transform: capitalize;
}

.our-team .social {
  width: 100%;
  padding: 0;
  margin: 0;
  background: #ff3a55;
  position: absolute;
  bottom: -100px;
  left: 0;
  transition: all 0.5s ease 0s;
}

.our-team:hover .social {
  bottom: 0;
}

.our-team .social li {
  display: inline-block;
}

.our-team .social li a {
  display: block;
  padding: 10px;
  font-size: 17px;
  color: #fff;
  transition: all 0.3s ease 0s;
}

.our-team .social li a:hover {
  color: #eb1768;
  background: #f7f5ec;
}
.user-s-follow a{
    border-radius: 4px;
    color: #fff;
    padding: 5px 10px;
    transition: opacity .2s;
    position: relative;
    cursor: pointer;
    font-size: 12px;
    margin: 0;
    white-space: nowrap;
    background: #ff3355;
    border: 1px solid #ff3355;
    border-radius: 5px;
}
@media only screen and (max-width: 990px) {
  .our-team {
    margin-bottom: 30px;
  }
}













/*首页模块标题*/
#biaoti.post-modules-top {
    display: flex;
    line-height: 1;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0px;
}
.modules-title-box .module-title {
    font-size: 22px;
    text-align: left;
    margin-right: 10px;
    font-weight: 500;
}
.wwwmodel-title {
    padding: 30px 0px 30px;
}
.clearfix {
    zoom: 1;
}
.wwwmodel-title .wwwmodel-title-left {
    float: left;
}
.wwwmodel-title .wwwmodel-title-left h3 {
    color: #333333;
    font-size: 22px;
}
.wwwmodel-title .wwwmodel-title-right {
    float: right;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-active {
    color: #666;
    font-weight: bold;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-item {
    display: inline-block;
    font-size: 14px;
    color: #999;
    cursor: pointer;
    margin-left: 44px;
    padding-bottom: 8px;
    transition: all ease 0.4s;
    position: relative;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-more {
    display: inline-block;
    padding: 0px 2px;
    font-size: 14px;
    color: #999;
    top: 3px;
    cursor: pointer;
    padding-bottom: 8px;
    margin-left: 40px;
    position: relative;
    transition: all ease 0.4s;
}
.clearfix:after {
    display: block;
    clear: both;
    content: "";
    visibility: hidden;
    height: 0;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-item:hover {
    color: #666;
    font-weight: bold;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-item:after {
    content: '';
    width: 0px;
    height: 1px;
    background-color: #3BC66F;
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    transition: all ease 0.4s;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-item:hover:after {
    width: 100%;
}
.wwwmodel-title .wwwmodel-title-right .wwwmodel-title-active:after {
    width: 100%;
}

/*首页模块仿照OM*/
.model-column {
    margin: 0 auto;
}
.model-column .common-model-wrap .model-item:nth-of-type(6n) {
  margin-right: 0
}

.model-column .model-item {
  max-height: 331px;
  width: 294px;
  margin: 0 16px 16px 0;
  transition: all .2s linear;
  border-radius: 5px
}

.model-column .model-item:hover {
  box-shadow: 0 8px 15px 0 rgba(0,0,0,.15);
  transform: translateY(-5px)
}

.model-column .model-item:hover .model-info>p {
  color: #e80000
}
.model-column .model-item:hover .model-info>div {
  color: #e80000
}
.model-column .model-item .model-cover {
  display: block;
  width: 100%;
  height: 285px;
  background-color: #fff
}

.model-column .model-item .model-cover img {
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity .5s linear;
  border-radius: 5px 5px 0 0
}

.model-column .model-item .model-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 46px;
  padding: 0 14px;
  background-color: #fff;
  border-radius: 0 0 5px 5px
}

.model-column .model-item .model-info .title {
  color: #666;
  white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
}

.model-column .model-item .model-info>p {
  flex: 2;
  padding-right: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.model-column .irregular-wrap {
  display: flex
}

.model-column .irregular-wrap .irregular-left {
  flex-shrink: 0;
  max-height: none
}

.model-column .irregular-wrap .irregular-left .model-cover {
  height: 634px
}

.model-column .irregular-wrap .irregular-center {
  max-width: 909px;
  display: flex;
  flex-wrap: wrap
}

.model-column .irregular-wrap .irregular-right .model-item {
  width: 590px;
  margin-right: 0
}
@media screen and (max-width: 1366px) {
.model-column .irregular-wrap .irregular-right .model-item {
  width: 496px;
  margin-right: 0
}
.model-column .model-item {
    max-height: 331px;
    width: 232px;
    margin: 0 16px 16px 0;
    transition: all .2s linear;
    border-radius: 5px;
}
.model-column .model-item .model-cover {
    display: block;
    width: 100%;
    height: 232px;
    background-color: #fff;
}
.model-column .irregular-wrap .irregular-left .model-cover {
    height: 528px;
}
}
/*首页问答列表*/

.encyclopedias {
  margin-top:10px;
}
.encyclopedias ul {
  width:100%;
  padding:20px;
  box-sizing:border-box;
  background:#fff;
    margin-bottom:30px; 
    margin-top:0px; 
}
.encyclopedias ul .px_item {
  width:50%;
  float:left;
}

.encyclopedias ul .px_item:nth-child(2n+1) {
  padding-right:10px;
  border-right:1px dotted #f0f0f0
}
.encyclopedias ul .px_item:nth-child(2n) {
  padding-left:10px
}
.encyclopedias ul .px_item a {
  display:block;
  width:100%;
  line-height:50px;
  box-sizing:border-box;
  font-size:15px;
  position:relative;
  background:#fff url(./img/zizhu/icon-q.png) 10px center no-repeat;
  border-radius:4px;
  padding-right:120px;
  padding-left:36px;
}
.encyclopedias ul .px_item a:hover {
  background:#f9f9f9 url(./img/zizhu/icon-q.png) 10px center no-repeat;
  border-radius:4px;
}

.encyclopedias ul .px_item a .question {
  position:absolute;
  height:50px;
  position:absolute;
  right:10px;
  top:0;
  z-index:2;
  /*background:url(./img/zizhu/icon-q.png) left center no-repeat;*/
  width:auto;
  padding-left:24px;
  line-height:50px
}

.encyclopedias ul .px_item a:hover .question {
  /*background:url(./img/zizhu/icon-q.png) left center no-repeat;*/
  width:auto
}
@media screen and (max-width: 768px){
.encyclopedias ul .px_item {
  width:100%;
  float:left;
}
.encyclopedias ul .px_item a {
    display: block;
    width: 100%;
    line-height: 30px;
    padding: 10px 0;
    box-sizing: border-box;
    font-size: 15px;
    position: relative;
    background: #fff url(./img/zizhu/icon-q.png) 0px 18px no-repeat;
    border-radius: 4px;
    padding-right: 0px; 
    padding-left: 25px;
}
.encyclopedias ul .px_item a .question {
    display: none;
}
.encyclopedias ul .px_item:nth-child(2n) {
  padding-left:0px
}
.encyclopedias ul .px_item:nth-child(2n+1) {
  padding-right:10px;
  border-right:1px dotted #fff;
}
}
.comment-text p strong{
    font-weight: 700;
    padding: 0 5px;
    color: var(--hover_color);
}
.part-title {
    display: flex;
    align-items: center;
    margin-bottom: -10px;
}
.puxin_sx{
    font-size: 14px;
    letter-spacing: .8px;
    position: relative;
}
.part-title h3 {
flex: 1;
margin-bottom: 10px;
font-size: 25px;
font-weight: normal;
white-space: nowrap;
margin-right: 10px;
padding-top: 1px;
}
.part-title p {
  letter-spacing: .5px;
}
.puxin_gd{
    white-space: nowrap;
    margin-left: 10px;
    padding-bottom: 20px;
}
.puxin_gd .btn {
    position: relative;
    padding: 0 16px;
    display: block;
    border-radius: 0px;
    color: #8590A6;
    background-color: #fff;
    height: 32px;
    font-size: 14px;
    color: #fff;
    line-height: 32px;
    background-image: -webkit-linear-gradient(0deg,#ff416c 0%,#ff4b2b 100%);
    display: flex;
    align-items: center;
}
.part-title .part-nav{
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 20px;
}
.part-title .part-nav .all {
  background: var(--hover_color);
  color: #fff;
}
.part-title i {
    padding-left: 10px;
}
.part-title .part-nav a {
  color: #606266;
  font-size: 13px;
  padding: 4px 10px;
  display: inline-block;
  margin-left: 20px;
  transition: all .3s
}
.title_puxin >div:nth-of-type(2) {
    margin-top: 10px;
    color: #999;
    font-size: 16px;
    margin-bottom: 20px;
}
/* VIP头像CSS */
.lv-icon.b2-vip0 b {
    color: #000 !important;
    background: linear-gradient(90.34deg, #D7E5FF 0.27%, #B9CBFF 99.7%);
    padding: 0 5px;
    border-radius: 3px;
}
.lv-icon.b2-vip1 b {
    color: #6C4A20 !important;
    background: linear-gradient(90.34deg, #FFD2A2 0.27%, #FFE2C2 99.7%);
    padding: 0 5px;
    border-radius: 3px;
}
.lv-icon.b2-vip2 b {
    color: #ffdbb1 !important;
    background: linear-gradient(90.34deg, #393f68 0.27%, #24263c 99.7%);
    padding: 0 5px;
    border-radius: 3px;
}
.lv-icon.b2-vip3 b {
    color: #ffffff !important;
    background: linear-gradient(90.34deg, #e54b63 0.27%, #e54b63 99.7%);
    padding: 0 5px;
    border-radius: 3px;
}
.user-w-lv {
    display: flex;
    height: 22px;
    flex-wrap: wrap;
}
.b2-vip0{
    background-image: url(https://onecad.cn/wp-content/themes/b2child/img/zizhu/vip.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.b2-vip1{
    background-image: url(https://onecad.cn/wp-content/themes/b2child/img/zizhu/vip.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.b2-vip2{
    background-image: url(https://onecad.cn/wp-content/themes/b2child/img/zizhu/vip.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.b2-vip3{
    background-image: url(https://onecad.cn/wp-content/themes/b2child/img/zizhu/vip.png);
    background-repeat: no-repeat;
    background-size: contain;
}
/* 图酷网会员列表 */

@media (min-width:768px) {
  .home-section-designs {
    display: block;
    width: 100%;
  }
}

.home-section-designs .items {
  overflow: hidden;
  margin: 0 -8px 0px
}

.home-section-designs .items .item-wrap {
  float: left;
  width: 50%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 8px
}

@media (min-width:1024px) {
  .home-section-designs .items .item-wrap {
    width: 25%
  }
}

.home-section-designs .items .item {
  background: #fff;
  overflow: hidden;
  -webkit-transition: all .2s;
  -o-transition: all .2s;
  transition: all .2s
}

.home-section-designs .items .item:hover {
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px)
}

.home-section-designs .items .item-thumb .thumb {
  padding-top: 100%
}

.home-section-designs .items .item-thumb .thumb:hover {
  opacity: .8
}

.home-section-designs .items .item-main {
  padding: 15px 0 0
}

@media (min-width:768px) {
  .home-section-designs .items .item-main {
    padding: 16px 25px
  }
}

.home-section-designs .items .item-main h2 {
  font-size: 18px;
  color: #3c3c3c;
  font-weight: 400;
  line-height: 20px;
  height: 20px;
  overflow: hidden;
  margin-bottom: 15px
}

.home-section-designs .items .item-main h2 span {
  margin-left: 5px;
  font-size: 13px;
  color: #b2b2b2
}

.home-section-designs .items .item-main h2:hover {
  color: #3385ff
}

.home-section-designs .items .item-main h4 {
  margin: 0 -5px;
  font-weight: 400;
  line-height: 22px;
  height: 22px;
  overflow: hidden
}
.one_list_a{
    font-size: 13px;
    margin-top: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    width: 100%;
    background: #ffffff;
    color: #bcbcbc;
}
.home-section-designs .items .item-main h4 span {
  display: inline-block;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background: #e5f0ff;
  font-size: 12px;
  color: #3385ff;
  padding: 0 5px;
  margin: 0 5px;
  white-space: nowrap
}

.home-section-designs .items .item-main h4 span:hover {
  background: #3385ff;
  color: #fff
}
/*自定义footer底部CSS*/
.fl{float:left;width: 40%;justify-content: space-between;display: flex;}
.fla{float:left;}
.fr{float:right;}
.public-foot{width:100%;background:#2d3237;display:table;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.public-foot .foot-cont{padding:30px
0;display:table}
@media screen and (max-width: 768px){
.public-foot{
    display: none;
}
}
@media screen and (min-width: 768px){
.footer-bottom{
    display: none;
}
}
.public-foot .foot-cont
h4{color:#fff;margin-bottom:20px}
.public-foot .foot-cont-fl ul>li
a{color:#b2b2b2;font-size:13px}
.public-foot .foot-cont-fl ul>li a:hover{color:#ff3a55}
.public-foot .foot-cont-fr
.tel{margin-right:55px;float: left; padding-top: 6px;}
.public-foot .tel-number{display:table}
.public-foot .tel-icon
.tel-icon-a{width:42px;height:42px;line-height:42px;background:#1e1f23;color:#8b8b8b;text-align:center;margin-right:8px;padding: 10px;}
.public-foot .tel-icon .tel-icon-a:hover{background:#ff3a55;color:#fff;}
.org{color:#ff3a55}
.public-foot .tel-number{font-size:24px;margin-top:20px}
.public-foot
.ewm{margin-top: 5px;}
.public-foot .ewm
span{display:block;text-align:center;color:#b2b2b2;padding-top: 5px;}
.public-foot .ewm ul
li{float:left;margin-left:30px;text-transform:uppercase}
.public-foot .ewm ul li
img{width:100px}
.foot-copyright{width:100%;color:#666;padding:20px
0 10px;display:table;border-top: 1px solid #23232a;}
.foot-copyright
p{font-size:12px;line-height: 30px;}
.foot-copyright p
a{color:#666}
.foot-copyright p a:hover{color:#ff3a55}
.foot-copyright-fr ul
li{float:left;margin-right:5px}
.foot-copyright-fr ul li
a{display:block}
.fl ul li{
    font-size: 13px;
    padding: 10px 0px;
    box-sizing: border-box;
}
.fl .html-widget {
    padding: 10px 0px 0px 0px;
}
.fl h2{
    font-size: 16px;
    padding: 5px 0px;
    color: #fff;
    line-height: 1;
    
}
.tel > h2 {
    font-size: 16px;
    padding-bottom: 22px;
    color: #fff;
    line-height: 1;
    font-weight: 500;
}
/*自定义home_srarch模块CSS*/
.flickity-enabled.is-draggable {
  margin-top: -25px;
}

本站资源均为网友推荐收集整理而来,请勿商业运营,仅供学习和研究,请在下载后24小时内删除!!
© 版权声明
THE END
点赞11
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容