第十章一些细节（二）-易看设计

标签可以被嵌套，但不能交叉

像上一章那种，一层标签，套着一层标签，这叫做嵌套。在这种情况下，每一个元素都被完整的套在另一个元素之中，除了最顶层的 html 元素。

我们要说的是，不可以将一个元素的开始和结束标签，分别放在两个元素之中。说直白一点，就是不能让人家一对分隔两地。

简单举个例子，我们有两段内容，第一段的末尾需要被强调，而下一段的开头也需要被强调。可能有的同学会这样写：

<!-- 注意这里是错误的代码演示 --><p>这里是第一段的内容，<strong>这里需要被强调</p><p>这里也需要被强调</strong>，strong 标签标记了强调的开始和结束。</p><!-- 注意这里是错误的代码演示，我努力地再强调一遍 -->

这样写是不可以的，因为 strong 的开始标签和结束标签，被分别放进了两个 p 元素中。他们分隔两地，很伤心，都是你的错！

那么从道理上讲，也是完全可以解释的，这是两个段落，说的就是两个意思，虽然前面的强调和后面的强调，是紧挨着的，但它们并不是连续的。既然是两个内容，当然要分别进行标记。所以正确的写法如下，：

<p>这里是第一段的内容，<strong>这里需要被强调</strong></p><p><strong>这里也需要被强调</strong>，strong 标签一家人整整齐齐的在一起，感到十分的开心，</p>

编码的切换

我们在第七章基本模板讲到了编码的问题，那里涉及东西太多，为了避免把大家绕晕，所以没有深入。不过编码这个问题太常见了，在这里简单的说一下切换的方式。

首先，保证网页中 <meta charset="UTF-8"> 和编辑器右下角的编码保持一致，大小写可以不区分。然后你在编辑器中查看这个文件，没有乱码，那就没有问题了。

这时候我们要先说一下编码是怎么回事，既然我们已经说明了这个文档使用的代码语言是 HTML，电脑应该就能够理解了啊，怎么又冒出来一个编码了呢？

那么还是用语言来打比方，我写的是中文，但是我是从上往下写，还是从左往右写，或是从右往左写（中文确实有这几种书写方向），这仍然是一个问题。当我们遇到一些匾额的时候，还要努力思考一下，究竟应该怎么读。电脑这么死板，遇到这类问题，一定也会迷糊。那么编码就是说电脑用何种格式把这些内容记录下来的意思。当然对于他具体使用的格式我们不需要深究，你只要知道用一种编码写下的东西，用另外一种编码去读就会产生乱码。这就好像，你按照从左到右的方式，去阅读我从上往下书写的文字，肯定觉得一片茫然，完全搞不懂什么意思。

那么编辑器右下角显示的是我们当前这个文档用何种编码书写，而 <meta charset="UTF-8"> 所规定的是浏览器用何种编码进行读取。

理解这个道理以后，问题就好办多了。现在你点击编辑器右下角的编码位置。