历史
Tim Berners-Lee 发明了万维网
互联网本质 内容共享
万维网 基于互利网 实现输入地址就能看到网页
HTML语法小贴士
HTML全称 Hyper Text Markup Language 超文本标记语言
H5 手机页面 程序员没有这个玩意 只有手机页面
CRM学习法 copy run modify
<link rel="stylesheet" href="XXXXXXX" /> <<错误规范 会自动纠错
<link rel="stylesheet" href="XXXXXXX" > <<正确规范
报错检查方法一
命令行下载 yarn global add node-w3c-validator
在vscode 用 node-w3c-validator -i 要检查文件名称
英语小课堂
heading 标题 paragraph 段落 article 文章 aside 旁边
body 身体 section 章节 main 主要 anchor 定点，锚
strong 强壮的 emphasis 强调 order 秩序 ordered 有顺序的
unordered 无顺序的 description 描述 term 术语 data 数据
quote 引用 block 块 inline 行内 break 打断
创建网页
在VScode上用"!"创建主体 一般加 <html lang = "zh-CN">
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>标题标签
<h1>这是一个标题。</h1>
<h2>这是一个标题。</h2>
<h3>这是一个标题。</h3>段落标签
<p>这是一个段落</p>© -->
主要内容用main标签包涵
次要内容用aside标签包涵
章节标签
section 双标签 将每个大章节包括在里面
<article>元素表示文档、页面、应用或网站中的独立结构，其意在成为可独立分配的或可复用的结构，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目。 同时具有全局属性
所有的标签都有的属性即全局属性
class 属性
<p class="one">这是一个class</p>contenteditable 可编辑 可以放在任何标签里面
<div contenteditable>contenteditable在这里可以编辑</div>hidden 可以让某个标签以及内容看不见
<p hidden>hidden可以让内容看不见</p>id 属性 尽量少用ID属性 不能确定一个页面定义多少个同名字ID 取名id id的名字在哇网页上只能是唯一的 style里面就是"#"
<p id="two">这是一个id属性</p>
style属性 就近原则 行内样式优先 有JS的JS优先 因为会覆盖style的内容
<p style="margin: 20px;">这是一个style属性</p>
tabindex属性 0是最后一个 1，2，3 按顺序访问 -1 不让找到 不必是连续的
<p tabindex="1">这是tabindex操作</p>
title 属性 鼠标浮上 显示文字提示
<p title="完整的内容">niahshxiajsbxhb</p>
小技巧
文字溢出省略
默认样式
每个浏览器都有自己独特的默认样式
用style的样式来覆盖默认样式
每次写网页记得重置样式 reset.css
内容标签
ol>li 有序列表
ul>li 无序列表
<p>前端每天要做的事情有:有序列表</p>
<ol>
<li>发邮件</li>
<li>发邮件</li>
<li>发邮件</li>
<li>发邮件</li>
</ol>
<p>前端每天要做的事情有:无序列表</p>
<ul>
<li>发邮件</li>
<li>发邮件</li>
<li>发邮件</li>
<li>发邮件</li>
</ul>
dl + dt + dd 自定义列表
<dl>
<dt>图图</dt>
<dd>一个动画</dd>
</dl>小贴士： 在代码中 多个空格 在网上只显示一个空格 如果想保留空格等便签 就用per标签包住 记得更换字体
<pre>这里有很 多空格</pre>hr 一条横线
br 换行
<hr>
我的上面有一条横线
<p>这里<br>
换行了</p>a 链接 target="_blank" 在新窗口打开
<a href="#" target="_blank">这里是链接</a>
code 写代码的 长和pre便签连用 形成空格和换行
<pre>
<code>
$a = '你好'
console.log(a);
</code>
</pre>em标签 强调 让文字倾斜 strong标签 让字体加粗
两者的区别
[引用于]（https://www.cnblogs.com/jjworld/p/5268575.html）
第一个层次的区别：
<em>标签是告诉浏览器把其中的文本表示为强调的内容，把这段文字用斜体来
表示。如果只想使用斜体字来显示文本的话，使用<i>标签。除了强调以外，当引入新的术语或者在
引用特定类型的术语或概念时作为固定样式的时候，也可以使用<em>标签。
<strong>标签和<em>标签一样，用于强调文本，但它强调的程度更高。
<strong>标签中的内容用加粗的字体来显示其中的内容。
第二个层次：em用来局部强调，strong则是全局强调。
第三个层次：em表示内容的着重点， strong表示内容的重要性。strong不会改变句子所在
第三个层次：em表示内容的着重点， strong表示内容的重要性。strong不会改变句子所在
第四个层次： em 表示语气上的强调 strong 表示内容本身的重要性
<em>123</em>
<strong>123</strong>quote blockquote 引用 块级引用
<p>老夫子说
<quote>我要天天开Q</quote>
</p>
<p>老夫子说
<blockquote>我要天天开Q</blockquote>
</p>资料来源：饥人谷
本文为贰贰的原创文章，著作权归本人和饥人谷所有，转载务必注明来源
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
