HTML＆amp; CSS：使用CSS正确对齐<h1>和<p>标签</p> </h1>

Question

我对“div”标签有疑问 - 包括文字和标题。 由于我还不能上传图片（由于我是这里的菜鸟），我会尽力解释。

• 一个“div”有一个“h1”后跟一个“p”。整个“div”向左浮动。
• 另一个“div”的“h2”跟随“p”。整个“div”正好浮出水面。

由于两个“text-divs”彼此相邻，我希望它们中的“p”能够完美对齐和镜像。由于我的“h1”比我的“h2”大，所以第一个“div”中的“p”比另一侧的“p”更低。

有没有一种聪明的方法可以解决这个问题？我尝试过使用边距和填充，但是要使它适合它似乎很复杂！

希望你明白，

最好的CSS_maniac

Answer 1

首先，我建议使用CSS重置脚本来限制您正在玩的变量（边距，填充，文本大小）的数量，并确保在所有浏览器中正确呈现。 Eric Meyer's CSS Reset非常受欢迎。然后，您可以调整h1和h2上的font-size以根据需要显示它们，并调整h1和h2上的padding-bottom或margin-bottom以使p正确对齐。

Answer 2

是。至少有10种方法可以解决这个问题。

您可以将以下任何属性添加到任何一个p标记

position: relative; top: (specify amount in px or em, without parentheses);

margin-top: 10px;

position: absolute; // Very similar to position: relative;

祝你好运

-Brian