准确的说,前面的都是准备工作,嘿嘿,老鼠又水了很多字数。

现在我们开始正式写点东西。最开始,当然是先写点简单的啦~比如写个作文什么的(好像要跑题的样子……

先做什么?先写模板啊,上节课学的,别和我说你忘记了。

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>稻米鼠贼帅!</title>
</head>
<body>
  <!-- 我们的代码放在 body 标签里 -->
  <!-- 就是替换掉这部分灰溜溜的文字 -->
  <!-- 这个模板有点长,会被说水字数 -->
  <!-- 我就不每段代码都把它写出来了 -->
  <!-- 但是你们不能偷懒,一定要写的 -->
</body>
</html>

(感觉这次水字数很成功……并不

那么,我们又发现一个新的标签,长的有点特殊,但是既然放在尖括号里,想必就是标签吧,就是上面这坨灰溜溜的东西。这个呢,是注释,他不起任何作用,也不会显示出来。诶?!那我们为什么要写它们?

我们的代码无可避免的会越写越长,等你回头看他们的时候就会觉得混乱,很难一下子就看出头绪来,这时候注释就很有用了,我们可以写上各种标记和说明,方便自己以后查看。注释这么写:

<!-- 两头尖括号,前边一个感叹号 -->
<!-- 每边两个减号,中间是注释的内容 -->

很简单吧,当然上面我是因为强迫症,每行写了一次,其实在注释里面也是可以换行的,比如:

<!-- 在这里面是可以换行的
就像这个样子
    前面有空格也没所谓 -->

(于是渐渐偏离了主题……

回来继续写作文,作文啊,首先要有什么?对,是标题,奖励你们一朵小红花~

标题,那我们就加粗吧,反正目前也就会这个。不可以哦,首先,strong 标签是强调的意思,而不能把它当做加粗(虽然他的表现是加粗)。

说起来很拗口,大概就是呢,大款和伙夫一般都比较胖,但是你不能说大款和伙夫就是胖子,划等号,那就错了。

这个很重要!HTML 要语义化,就是说 HTML 不是用来解决这些元素长成什么样的,而是用来说明每一个元素它是什么的。胖不胖的问题不是我们的关注点,但他是大款还是伙夫这个问题要说明白。

那么我们写下一段文字,作为标题,于是就要用标签标记出来,这个是标题。但是,问题又来了,我们写作文还好,如果写报告,那上面大标题,下面副标题,文章里面还要有各种小标题,甚至一层套一层。这些都是标题,但是总该区分一下吧,上面不是说了语义化吗,那这个问题是有必要说清楚的。

所以我们的标题标签有六个,怎么样,六个级别的标题一般都够用了吧?而且特别好记哦~

<h1>这个是最大的标题</h1>
<h2>这个是二级标题</h2>
<h3>这个是三级标题</h3>
<h4>这个是四级标题</h4>
<h5>这个是五级标题</h5>
<h6>这个是最小的标题</h6>

这种东西,看一遍就能记住的吧?记不住的把你们小学一年级数学老师的电话号码给我留下,我想和他探讨一下十以内的数学问题。

标题问题解决了,我们开始第一段……诶,你不说语义化么,那,段落是不是也要标记一下?是的,段落也要标记,而且,这个就涉及到了我们写代码的格式问题(下一章说哦)。现在呢,先记住段落用 p 标签标记。

所以我们就可以写出如下作文了:

<!-- 这部分内容要放在 body 标签中哦 -->
<h1>老鼠叫我写作文</h1>
<p>第一段先夸老鼠超迷人~</p>
<p>第二段不知该写啥,凑字数啥的很愁人。</p>

【本章助记卡片:卡片 for 第八章