答案 0 :(得分:1)
只需为你的html中的两个屏幕添加@media,并在你的html代码中添加标签!
答案 1 :(得分:0)
这是鳕鱼。
<style>
div.cities {
background-color: #ecf0f1;
color: #000;
border:3px solid #bdc0c1;
border-style:dashed; }
.clear {clear: both}
.flex{ display:flex;margin: 20px; padding: 20px 0 0 0;}
.flex img{
width: 60px;
height: 60px;
margin: 0 10px;
}
.flex strong {font: 14px isans-light; color: #4c4b51;}
.flex p {width: 145px; height: 40px;color: #8d8d8d;font: 12px isans-light}
</style>
<div class="cities">
<div class="flex">
<img src="wp-content/uploads/2017/01/f-01.png"/>
<div>
<strong> Lorem ipsum dolor sit amet, consectetuer adipiscing
</strong>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
</div>
<img src="wp-content/uploads/2017/01/f-02.png"/>
<div><strong>Lorem ipsum dolor sit amet, consectetuer adipiscing</strong>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
</div>
<img src="wp-content/uploads/2017/01/f-03.png"/>
<div><strong>Lorem ipsum dolor sit amet, consectetuer adipiscing </strong>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
</div>
<img src="wp-content/uploads/2017/01/f-4.png"/>
<div><strong>Lorem ipsum dolor sit amet, consectetuer adipiscing</strong>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing </p>
</div>
</div>
</div>
&#13;