标题、段落和列表 · 跟马丁学编程

跟我看：内容有专属的标签

HTML 为每种内容都有专门的标签。这些是你用得最多的：

<h1>Main heading – only once per page</h1>
<h2>A chapter heading</h2>
<h3>A smaller heading inside a chapter</h3>

<p>An ordinary paragraph of text.</p>
<p>Another paragraph. Every paragraph gets its own <p> tag.</p>

<p>You can <strong>make words bold</strong> or <em>italic</em>.</p>

标题从 <h1>（最大）到 <h6>（最小）。就像笔记本：<h1> 是封面上的标题，<h2> 是章节，<h3> 是小节。

列表

<!-- A bulleted list (ul = unordered list) -->
<ul>
  <li>first thing</li>
  <li>second thing</li>
</ul>

<!-- A numbered list (ol = ordered list) -->
<ol>
  <li>step one</li>
  <li>step two</li>
</ol>

每个列表项是一个 <li>，它们都包在 <ul>（圆点）或 <ol>（数字）里。

💡

那行看起来怪怪的 <!— text —> 是注释——只给你自己看的备注，浏览器会忽略它。程序员经常在代码里这样给自己留消息。

轮到你了 💪

用内容填满你的首页。它应该有：

一个 <h1>（你已经有了），
至少两个章节，每个有 <h2> 标题和一段文字，
至少一个列表（<ul> 或 <ol>），
用 <strong> 加粗的内容。

各项目的想法和参考答案：

🏫 学校网站——想法和参考答案

章节可以是：关于我们的学校、即将发生的事，以及一个俱乐部列表。

<h1>Riverside Elementary School</h1>
<p>Welcome to our school's website.</p>

<h2>About Our School</h2>
<p>Our school has stood in Riverside for <strong>120 years</strong>. We have
350 students, a big gym, and a brand-new computer lab.</p>

<h2>Clubs</h2>
<ul>
  <li>floorball</li>
  <li>ceramics</li>
  <li>coding</li>
  <li>choir</li>
</ul>

<h2>Coming Up</h2>
<ol>
  <li>outdoor school (June)</li>
  <li>sports day</li>
  <li>winter fair</li>
</ol>

🙋 个人网站——想法和参考答案

章节可以是：我喜欢什么、我会什么，以及最喜欢的游戏或书籍列表。

<h1>Hi, I'm Jake</h1>
<p>I'm 10 years old and this is my website.</p>

<h2>What I Like</h2>
<p>More than anything, I love <strong>soccer</strong> – I play for the youth team.
At home I build worlds in Minecraft and I'm learning to code.</p>

<h2>My Top Games</h2>
<ol>
  <li>Minecraft</li>
  <li>Mario Kart</li>
  <li>Rocket League</li>
</ol>

<h2>What I Can Do</h2>
<ul>
  <li>juggle a soccer ball</li>
  <li>make pancakes</li>
  <li>build a website (right now!)</li>
</ul>

🌍 旅行日记——想法和参考答案

章节可以是：上次旅行、接下来要去哪，以及去过的国家列表。

<h1>Where We've Been 🌍</h1>
<p>A journal of our trips and adventures.</p>

<h2>Last Trip: The Mountains</h2>
<p>Over the summer we hiked <strong>the whole ridge</strong>. Three days of
walking, one wrong turn, and a hundred wild berries.</p>

<h2>Countries I've Visited</h2>
<ul>
  <li>United States</li>
  <li>Canada</li>
  <li>Mexico</li>
  <li>Italy</li>
</ul>

<h2>Next Year's Plan</h2>
<ol>
  <li>camping by the lake</li>
  <li>mountains out west</li>
  <li>the beach in Greece</li>
</ol>

⚽ 俱乐部网站——想法和参考答案

章节可以是：关于俱乐部、最近的比赛结果，以及球员名单列表。

<h1>Riverside Eagles FC</h1>
<p>The official website of our soccer club.</p>

<h2>About the Club</h2>
<p>We play in the district youth league. We train
<strong>Tuesdays and Thursdays at 5:00 PM</strong> on the field behind the school.</p>

<h2>Recent Results</h2>
<ol>
  <li>Eagles – Hawks 3 : 1</li>
  <li>Falcons – Eagles 2 : 2</li>
  <li>Eagles – Wildcats 4 : 0</li>
</ol>

<h2>Roster</h2>
<ul>
  <li>Jake – goalkeeper</li>
  <li>Matt – defense</li>
  <li>Owen – midfield</li>
  <li>Tom – forward</li>
</ul>

✅

检查一下： 页面有大标题、小章节标题、段落，以及至少一个圆点或数字列表。看起来像一个真正的（虽然还没打扮的）网站了。

这堂课你要记住

标题 <h1>–<h6> 像书的章节一样组织页面。
文字放在 <p> 段落里；用 <strong> 和 <em> 突出显示。
列表：<ul> 是圆点，<ol> 是数字，项目总是在 <li> 里。