.hw{ width:320px; height:320px; overflow: hidden; .hw-header{ height:80px; width:100%; display:flex; flex-direction: row; .syj{ height:100%; margin-top: 20px; justify-content: center; align-items: center; .img{ max-height: 100%; } } .hw-img{ height:100%; margin-top: 20px; margin-left: 30px; display: flex; justify-content: center; align-items: center; .img{ max-height: 50%; } } } .hw-content{ background-color: white; background-size: contain; border: 1px solid #ccc; border-radius: 50px; width:100%; height:260px; margin-top:-30px; clear:both; display:flex; .hw-items{ height:140px; width:100%; margin-left:25px; margin-right:55px; margin-top:70px; overflow: hidden; .scroll{ width:100%; display:flex; flex-direction: row; .item{ float:left; display: flex; flex-direction: column; width:50%; .name{ font-size:12px; width:100%; text-align:center; } .image{ padding:8px; .img{ width:100px; height:100px; } } } } } } }