css - 使用响应式设计是否可以显示不同的页面布局？

Question

我不想在移动设备上显示某些内容，例如广告。我可以为桌面更改此草稿吗

<DIV> ADS</DIV> <DIV> Content 1</DIV> 
<DIV> Content 2</DIV> <DIV> Content 3</DIV> 

类似于下面的移动布局(不显示广告部分)

<DIV> Content 1</DIV>
<DIV> Content 2</DIV>
<DIV> Content 3</DIV>

Answer 1

如果您给广告一个类，并使用 CSS @media，就可以:

<div class="Mobile-no-show">Ads</div>
<div>Everything Else...</div>

CSS:

@media (max-width:500px){
.Mobile-no-show{
display:none;
}
}

JSFiddle Demo