我在WordPress的CSS文件中创建了一个类。
.leftfloat{ float:left; padding-right:10px; }
我在文章中使用它来让文本环绕图片,就像这样:
<div class ="leftfloat" > image code or ad code </leftfloat>
这个功能在电脑和移动设备上都可以正常运行。然而,我希望在移动设备上禁用此浮动。所以我做了以下操作:
在模板中已经定义了@media
,我只需添加.leftfloat {float: none;}
但是在检查时发现,在移动设备上它并没有禁用浮动。
@media screen and (max-width: 860px) {
.leftfloat {float: none;}
}
@media screen and (max-width: 1020px) {
.leftfloat {float: none;} }
@media screen and (max-width: 767px) {
.leftfloat {float: none;}
}
@media screen and (max-width: 620px) {
.leftfloat {float: none;} }
@media screen and (max-width: 420px) {
.leftfloat {float: none;}
class
后面的空格怎么办?应该把class ="leftfloat"
改为class="leftfloat"
。 - enapupe@media (max-width:1020px){....}
,删除screen and
。 - pablito.aven