做页面响应式的时候,在@media使用nth-child无法获取div,请问怎么修改?

我使用.header>div:nth-child(2) .navigation_other希望把类名navigation_other的div背景色和top设置一下

但是这个写一直无法正确设置,请问怎么处理?

.navigation_other {
    background-color: rgba( 0, 0, 0, 0.9 );
    color: rgba(255,255,255,1);
    height: 50px;
    line-height: 50px;
    display: none;
    position: absolute;
    width: 100%;
    top: 50px;
}
    

/*尺寸为640px手机端*/
@media only screen and (max-width: 640px) {
    .header>div:nth-child(2) .navigation_other {
        display: block
        position: absolute;
        width: 100%;
        top: 50px;
    }
}
<header id="header" class="header">
    <div id="head_describe">
        <div id="head_describe_uu">
            <ul>
                <li class="head_li header_login">
                    <div id="head_li_please"><a href="login.html" class="login_a"><span id="user_describe">亲,请登录</span></a></div>
                    <div id="head_li_information">
                        <ul>
                            <div class="clear"></div>
                            <li class="head_li_li" id="head_li_change"><a href="information_change.html">修改个人信息</a></li>
                            <div class="clear"></div>
                            <li class="head_li_li" id="head_li_logout"><a href="php/logout.php">注销</a></li>
                        </ul>
                    </div>
                </li>
                <li class="head_li" id="head_li_free_register"><a href="register.html"><span id="free_register">免费注册</span></a></li>
            </ul>
            <!--手机端导航条-->
            <div class="mobile_phone_navigation">
                导航
            <div>
            <!--//手机端导航条-->
        </div>
    </div>
    <div class='navigation_other navigation_index'>
        首页
    </div>
    <div class='navigation_other navigation_index'>
        征婚信息
    </div>
</header>
阅读 1.5k
2 个回答

写错了啊,兄弟`
<div class="mobile_phone_navigation">

            导航
        <div>
@media only screen and (max-width: 640px) {
    .header>div:nth-child(2).navigation_other {//此处不用空格,因为div和.navigation_other是同一个
        display: block
        position: absolute;
        width: 100%;
        top: 50px;
    }
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题