最常用的 CSS 属性

• font-size：文字大小
• color：前景色（文字颜色），包括文字、装饰线、边框、外轮廓等的颜色。
• background-color：背景色
• width：宽度
• height：高度

HTML

<h2>星球介绍</h2>
<div class="item">
  <h3>木星</h3>
  <img class="album" src="https://gitcode.net/weixin_44007374/note_temp_img/-/raw/master/muxing.jpg" alt="木星 Jupiter" />
  <p>
    <span class="keyword">木星（Jupiter）</span>
    是太阳系八大行星中体积最大、自转最快的行星，从内向外的第五颗行星。它的质量为太阳的千分之一，是太阳系中其它七大行星质量总和的 2.5
    倍。由于木星与土星、天王星、海王星皆属气体行星，因此四者又合称类木行星（木星和土星合称气态巨行星）。木星是一个气态巨行星，占所有太阳系行星质量的 70%，主要由氢组成，占其总质量的 75%，其次为氦，占总质量的
    25%，岩核则含有其他较重的元素。人类所看到的通常是大气中云层的顶端，压强比 1 个大气压略高。
  </p>
</div>
<div class="item">
  <h3>地球</h3>
  <img class="album" src="https://gitcode.net/weixin_44007374/note_temp_img/-/raw/master/diqiu.jpg" alt="地球 Earth" />
  <p>
    <span class="keyword">地球（Earth）</span>
    是太阳系八大行星之一，按离太阳由近及远的次序排为第三颗，也是太阳系中直径、质量和密度最大的类地行星，距离太阳 1.5 亿公里。地球自西向东自转，同时围绕太阳公转。现有 40~46 亿岁，
    它有一个天然卫星——月球，二者组成一个天体系统——地月系统。46 亿年以前起源于原始太阳星云。
  </p>
</div>

CSS

.item {
  width: 360px;
  display: inline-block;
  vertical-align: top;
  /* float: left; */
  margin-left: 20px;
}

.item img {
  width: 360px;
  height: 180px;
}

.keyword {
  font-size: 20px;
  color: white;
  background-color: orange;
}

http://localhost:3000

星球介绍

木星

木星（Jupiter）是太阳系八大行星中体积最大、自转最快的行星，从内向外的第五颗行星。它的质量为太阳的千分之一，是太阳系中其它七大行星质量总和的 2.5 倍。由于木星与土星、天王星、海王星皆属气体行星，因此四者又合称类木行星（木星和土星合称气态巨行星）。木星是一个气态巨行星，占所有太阳系行星质量的 70%，主要由氢组成，占其总质量的 75%，其次为氦，占总质量的 25%，岩核则含有其他较重的元素。人类所看到的通常是大气中云层的顶端，压强比 1 个大气压略高。

地球

地球（Earth）是太阳系八大行星之一，按离太阳由近及远的次序排为第三颗，也是太阳系中直径、质量和密度最大的类地行星，距离太阳 1.5 亿公里。地球自西向东自转，同时围绕太阳公转。现有 40~46 亿岁， 它有一个天然卫星——月球，二者组成一个天体系统——地月系统。46 亿年以前起源于原始太阳星云。