0

我想删除文章标签中的 h2 和 p 元素之间的空白行（为什么使用文章？我的导师要求我们在项目中使用 5 个新的 html5 元素。）我尝试过：

#prime h2 {
     margin-top:0em; 
}

#prime p  {
         margin-bottom:0em;
}

这将我的 h2 一直移动到右侧并进入 2 行。. 然后我尝试了来自 Josmh 的堆栈/溢出建议，在 2011 年 10 月 13 日 19:16 回答：

 #prime h2,p{
        padding: 0;
        margin: 0;
    }

    #prime h2,p {
        display: inline;
    }

这将我的导航栏移动到与 h2 相同的行，Carol 的 Welcome to Party。

代码不起作用是因为我使用的是文章吗？我的代码：

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Parties by Carol</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<link href="css/main.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="wrapper">
  <header id="hdr">
    <h3>throw a ball</h3>
    <h2>throw a line</h2>
    <h1>Throw a Party!</h1>
    <div id="party"><img src="images/balloons2.jpg" width="125" height="125" alt="A Party"/></div>
    <p>Parties by Carol</p>
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="Final-1.html">Home</a></li>
      <li><a href="#">About Us</a></li>
      <li><a class="MenuBarItemSubmenu" href="#">Types of       Parties</a>
        <ul>
          <li><a href="#">Quinceneras/Sweet 16</a></li>
          <li><a href="#">Bar/Bat Mitzvahs</a></li>
          <li><a href="#">Tots and Toddlers</a></li>
        </ul>
      </li>
      <li><a href="#">Contact Us</a></li>
    </ul>
  </header>
  <article id="prime"><h2>Welcome to Parties by Carol</h2>
    <p>
      For your next celebration, contact Parties by Carol. Whether your event is for two or two hundred, Parties by Carol can and will accommodate your needs. We specialize in fulfilling your every wish, whether at our facility or a location of your choice. We have a wide and varied menu that can be customized for your special event. Parties by Carol offers a combination of skills to help create unique and memorable occasions for you and your guests. So relax and leave everything to Parties by Carol. We aim to please and we will.</p>
  </article>
  <aside id="sbar1">
    <p>Beautiful Venue</p>
    <p>Devine Food</p>
    <p>Great Music</p>
    <p>Fun People</p>
    <p>&nbsp;</p>
  </aside>
  <footer>&copy;Copyright - 2014 CAS</footer>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>



#prime h2 {
     margin-top:0; 
}

#prime p  {
         margin-bottom:0;
}

#prime h2, p  {
    display: inline;
}
4

1 回答 1

0

边距不应该反过来设置吗？我猜<p>是在下面<h2>。

h2 {
     margin-BOTTOM: 0; 
}

p  {
     margin-TOP: 0;
}
于 2014-04-13T19:51:22.620 回答