Question

我有完整代码here

的以下HTML代码

    <div id="header">

        <a href="index.html" id="logo">
             <h1 class="headings">THE 100 DAYS PROJECT</h1>

        </a>


        <nav>
            <ul>
                <li><a href="portfolio.html">Portfolio</a></li>
                <li><a href="about.html">About</a></li>
                <li><a href="contact.html">Contact</a></li>

            </ul>
        </nav>
  </div>


 <div id="contact_container">

        <h3>General Informations</h3>

       <p>I am not currently looking for new design work, but I am available for speaking gigas and similar engagaments. If you have any questions, please don't hesitate to contact me!</p>

        <p>Please only use phone contact for urgent inquiries. Otherwise, twitter and email are the best way to reach me.</p>

        <h3>Contact info</h3>

                <ul class="contact_info">

                   <li>Phone</li>
                   <li>Email</li>
                   <li>Blog</li>
               </ul>

虽然我没有在联系人部分中为列表指定任何样式，但子弹不显示，并且项目以内嵌方式显示。从我所看到的，影响它的代码行是：

          #header ul, li {
             display: inline-block;
               }

为什么会这样？我希望在联系人部分中我的未排序列表显示子弹并将项目放在不同的行上。 THX！

Answer 1

因为#header ul, li表示#header ul或li，不是#header ul或#header li。

相反，将选择器编写为#header ul, #header li。

为什么标题的样式会影响我的内容div？

1 个答案: