<markdown> [\<\< 返回HTML教程](:document/html) # HTML 须知 ## 设定文档语言 ```html <html lang="zh-CN"> ``` * SEO(搜索引擎优化) * 有助于视觉障碍人士通过读屏器阅读页面 设定部分页面内容的语言 ```html <p>日语 <span lang="jp">ご飯が熱い</span> 的意思是什么?</p> ``` ## 块级元素和行内元素 * 块级元素在页面中以块的形式展现 - 块级元素不会被嵌套进内联元素中,但可以嵌套在其它块级元素中,如 `<div>`,`<h1>`, `<p>`。 * 行内元素通常出现在块级元素中并被其它文本所包围 - 行内元素不会导致文本换行,如 `<a>`,`<em>`,`<strong>`。 ## 属性 ### 布尔属性 比如 `<input>` 被添加 `disabled` 属性后,就接收不到用户输入了。 ```html <input type="text" disabled> <input type="text"> ``` ### 全局属性 `id`, `class`,`style`,`title` 都是是全局属性,可以被任何 HTML 元素使用。 `hidden` 可用于隐藏某个页面元素。 ```html <div class="notice" hidden>请先登录</div> ``` `contenteditable` 全局属性可以使元素内容变成可编辑。 ```html <p contenteditable>同学们好!<p> ``` ### 单引号或者双引号? 都行 ```html <a href="http://www.example.com">A link to my example.</a> <a href='http://www.example.com'>A link to my example.</a> <a href="http://www.example.com" title="Isn't this fun?">A link to my example.</a> ``` ## 在HTML中包含特殊字符 | 显示 | 代码 | | :---: | :---: | | < | `<` | | > | `>` | | " | `"` | | ' | `'`| | & | `&` | ```html <p>在 HTML 里,你可以用 <p> 来表示段落。</p> ``` ## 注释 ```html <p>老板你真英明!<p> <!-- <p>我老板是傻X!</p> --> ``` **快捷键**:在 VSCode 里按 `ctrl + /` 或 `command + /` 注释代码。 ## 参考链接 * https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes * https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Getting_started </markdown>