Question

当屏幕尺寸变小时，我试图隐藏电子邮件div类。

我为div类做了这个，它包含一组列，但不能隐藏包含登录用户电子邮件地址的div类。

<div class="cert">
    <h1 class="certname">
        <?php
        global $current_user;
        get_currentuserinfo();
        echo 'Hi, <a href="https://vle.uxbridge.ac.uk/intranet/members/' . $current_user->user_login . '/profile/change-avatar/">' . $current_user->display_name . '</a>' . "\n";

        ?></h1>
    <h2 class="certemail">
        <?php
        global $current_user;
        get_currentuserinfo();
        echo '<a href="https://outlook.office.com/owa/" target="_blank">' . $current_user->user_email . '</a>' . "\n";

        ?>
    </h2>
</div>

和css：

@media only screen and (max-width: 300px) {
.cert { display:none !important; }
}

Answer 1

您的媒体查询应该有效，但请注意300px是一个非常小的尺寸，它比大多数移动设备小（320px是iPhone 4屏幕分辨率）。

当屏幕尺寸小于或等于300像素时，您的媒体查询会将.cert div设置为display: none !important - 这是您想要的行为吗？

Answer 2

你想只隐藏电子邮件或总div？如果你只想隐藏电子邮件，那么css应该是：

@media only screen and (max-width: 300px) {
.cert .certemail{ display:none !important; }
}

Answer 3

试试这个

＆＃13;

onNext()

＆＃13;

在css中使用@media隐藏div类

3 个答案: