HTML – 如何在不向下移动的情况下使文本边距变小？

概述我正在为freecodecamp做一个项目,我需要创建一个类似于 this example的项目. 我的问题是底部的部分是无序列表和上面的标题.什么css可以使标题边距与示例中的方式对齐？我已经尝试过使用保证金,但是它会垂直改变边距,而不仅仅是左右边距. 当前代码： <div id=“timeline”> <h4>Here's a timeline of Dr. Borlaug's life< 我正在为freecodecamp做一个项目,我需要创建一个类似于 this example的项目.

我的问题是底部的部分是无序列表和上面的标题.什么CSS可以使标题边距与示例中的方式对齐？我已经尝试过使用保证金,但是它会垂直改变边距,而不仅仅是左右边距.

当前代码：

<div ID=“timeline”>  <h4>Here's a timeline of Dr. Borlaug's life</h4>  <ul>    <li>example</li>    <li>example</li>    <li>example</li>    <li>example</li>  </ul></div>

如果我有什么额外的东西让我知道,我会指出.

解决方法 有几种方法可以做到这一点,但如果您尝试匹配您提供的示例站点,那么您的CSS和HTML应如下所示：

<div ID=“timeline”>  <ul>    <h4>Here's a timeline of Dr. Borlaug's life</h4>    <li>example</li>    <li>example</li>    <li>example</li>    <li>example</li>  </ul></div>ul {  max-wIDth: 550px;  margin: 0 auto;  text-align: left;}

正在使用的代码示例：https://jsfiddle.net/o96uayxc/1/

freeCodeCamp的人已经将最大宽度应用于列表,然后使用margin：0 auto;使元素居中.这是因为具有auto值的边距在元素的任一侧均等地填充空白空间.重要的是,标题位于其示例中的List元素内,使其保持在max-wIDth范围内.元素文本左对齐,确保所有元素均匀对齐.

总结

以上是内存溢出为你收集整理的HTML – 如何在不向下移动的情况下使文本边距变小？全部内容，希望文章能够帮你解决HTML – 如何在不向下移动的情况下使文本边距变小？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。