刚刚学习响应式设计
我使用@media来适应屏幕修改一部分css
原来的display:flex;在@media里修改成display:block;却没有效果
请问是哪里出错了?请问该怎么实现这个效果?
谢谢大家
<div class="section_title">
<h1>Featured Work</h1>
</div>
<div class="selection">
<div class="selection_option">
<img src="http://placehold.it/250x150" alt="option_image">
<h3>APPIFY</h3>
</div>
<div class="selection_option mid_option">
<img src="http://placehold.it/250x150" alt="option_image">
<h3>SUNFLOWER</h3>
</div>
<div class="selection_option">
<img src="http://placehold.it/250x150" alt="option_image">
<h3>BOKEH</h3>
</div>
</div>
@media screen and (max-width: 350px) {
.selection {display: block;}
}
.selection {
display: flex;
}
你再好好看看你写的东西。
两个样式写到一个@media里,flex样式还是后写的,可不是flex生效。