HTML作为前端三大基本知识点之一，是每个前端开发者必须掌握的一部分。今天，在这篇文章中，让我们来看看一些我们通常不关注，但在面试中可能会问的话题。看看你能不能全部做到。

来学习你不知道的HTML知识

超文本标记语言

众所周知，textarea是表单中非常常见的元素，用于多行文本输入，可以设置行数和列数。

但是默认的textarea样式在页面上看起来很难看，很多页面都是用div模拟textarea实现的。比如看了QQ空间的源代码，你会发现这个输入框其实是一个div元素，而不是textarea元素。现在让我们看看这是如何实现的。

首先来看看效果如何。

来学习你不知道的HTML知识

达到效果

关键属性：内容可编辑

就像这个属性的字面意思一样，可以理解为可编辑。如果在页面标签上设置了contenteditable=true，则可以编辑标签。

它可以与用户修改属性相匹配，这意味着控制用户是否可以编辑页面元素。您可以通过设置不同的值来选择富文本或纯文本内容。但是因为这个属性是非标准属性，很少有人知道。

首先，让我们看看页面的HTML部分，它是一个简单的div标签，然后将contenteditable属性设置为true。

来学习你不知道的HTML知识

HTML部分代码

接下来，我们来看看整个CSS代码的完整实现。

来学习你不知道的HTML知识

CSS样式

最小高度和更大高度属性可以控制div的高度，当内容超过更大高度时会出现滚动条。如果要固定div的高度，只需要设置height属性，而不需要设置min-height和max-height属性。

Src和href在用法上都是对外部资源的引用，但在具体理解上有差异。

href的值指定资源在网络上的位置，并定义当前页面上的元素和所需资源文件之间的链接。例如，以下语句。

来学习你不知道的HTML知识

Href参考

当浏览器解析页面上的这个语句时，它会知道这里引用了一个外部样式文件，但是它不会阻止页面解析。这与@import有很大不同，所以在引入外部样式时建议使用链接标签。

src的值代表页面上的基本内容，指定的内容需要加载到当前页面中。例如，以下语句。

来学习你不知道的HTML知识

Src参考

当浏览器解析页面上的这个语句时，浏览器解析、编译并执行这个文件，导致整个页面加载暂停，这就是为什么脚本标记通常放在body end标记之前。

有一个更好的理解方式，href代表一个资源的链接；Src是当前元素的替换，内容最终会嵌入到当前页面中。

目前大多数网页采用DIV CSS布局，但也有少数老式网页采用Table布局。我们可以一起看看这两种布局的优缺点。

来学习你不知道的HTML知识

布局比较

Div css布局

div css的布局属于W3C标准，由于css的存在，HTML部分的代码会显得很纯粹，满足了行为、样式、结构分离的原则。

页面加载速度更快，这是目前广泛使用DIV CSS的一个非常重要的原因。

页面编码的数量比表格布局少得多。

页面内容更容易维护，因为CSS文件中存在样式，只需要修改CSS文件，不会影响HTML文件。

因为DIV CSS布局更容易优化SEO，所以被搜索引擎收录更方便。

表格布局

DIV CSS虽然有各种优点，但是表格布局也不是完全没用。在这里，我们还可以列出使用表格布局的几个优点。

方便初学者学习(相信很多后端RDs在开始前端学习的时候都是从表格布局开始的)。

兼容性更好，因为Table布局是从最老的浏览器开发出来的，兼容性会满足所有浏览器。但是CSS3的出现要考虑浏览器支持的程度，一个风格要考虑添加几个不同的浏览器前缀，比如-webkit，-moz等等