如何在主页上隐藏Section?

时间:2014-06-07 08:19:03

标签: html css

我在这里得到了这段代码:

<head></head>

  <body class="home page page-id-529 page-template page-template-template-h…up-blog tax-has no-child admin-bar-showing customize-support">

<header>
    <section id="top-bar"></section>
    <div id="mobile-menu"></div>
    <section id="header-container">
        <div class="wrapper">
            <section id="logo-wrapper" class="one_fourth"></section>
            <!--

             end logo 

            -->
            <section id="navigation-wrapper" class="three_fourth last">
                <nav>
                    <div class="menu-primary-menu-container">
                        <ul id="menu-footer-menu-1" class="sf-menu sf-js-enabled sf-arrows">
                            <li id="menu-item-3982" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3982"></li>
                            <li id="menu-item-4094" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4094"></li>
                            <li id="menu-item-4095" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4095"></li>
                            <li id="menu-item-4096" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4096">
                                <a href="http://localhost:8888/WebNueva/wordpress/submit-listing-2/"></a>
                            </li>
                        </ul>
                    </div>
                </nav>
            </section>
            <!--

             end navigation 

            -->
            <div class="clearboth"></div>
        </div>
    </section>
    <div id="header-border"></div>
</header>

我知道如何隐藏主页中的标题:

body.home header {display:none}

但是这会隐藏整个标题的部分,我只想隐藏标题容器部分并保持顶部栏显示。

如何隐藏onlu header-container部分?

此致

2 个答案:

答案 0 :(得分:2)

确保定位要隐藏的特定元素

body.home #header-container {
    display: none;
}

如果您使用的body.home header<header>元素匹配。

使用body.home #header-container匹配<section id="header-container">元素。

答案 1 :(得分:1)

定位标题内的元素:

body.home header #header-container {display:none}

由于id在页面中是唯一的,除非你为另一个重复使用id的页面使用相同的样式表,否则这就足够了:

#header-container {display:none}