@media screen and (max-width:1200px){ #sidebar{ display:none; } .pro_list{ display:block; border-bottom:#cacaca 1px dashed; margin:10px 0 0 0; } .pro_list_img{ width:60px; height:60px; float:left; margin:10px 5px; text-align:center; } #side_passage .pro_list .pro_list_img img{ max-width:60px; max-height:60px; } .pro_list h5{ font-size:14px; margin:0 20px 5px; text-overflow:ellipsis; white-space:nowrap; display:block; overflow:hidden; } .pro_list p{ margin:0 20px 10px; text-overflow:ellipsis; word-break:break-all; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; } #show_pic{ display:block; margin:10px auto; max-width:80%; } #passage{ margin:0 20px 30px; } #passage *{ font-size:14px!important; } #pass_btn{ text-align:center; } #passage img{ max-width:100%; } } @media screen and (min-width:1200px){ #show_pic{ float:right; max-width:300px; } #passage{ padding:0 0 30px 20px; } .pro_list{ display:block; border-bottom:#cacaca 1px dashed; } .pro_list_img{ width:120px; height:100px; float:left; margin:20px 30px; text-align:center; } #side_passage .pro_list .pro_list_img img{ max-width:120px; max-height:100px; } .pro_list h5{ font-size:18px; margin:20px 0 5px 0; } .pro_list p{ } #side_passage{ margin-bottom:100px; } }