HTML 之 初体验
HTML 是什么？
- HTML 是超文本标记语言，不是编程语言。
- HTML 文本是由 HTML 命令组成的描述性文本。
- HTML 由 文本内容、外部资源引用、标记 三部分组成。
- HTML 里的内容都是基于标签实现的。如
<h2></h2> - HTML 里面的内容若想识别，必须给他加上标签。
HTML 的结构
<!DOCTYPE html>告诉浏览器这是一个 html 文档<html></html>根元素 所有 html 内容必须写在这里面<head></head>头部内容 对用户不可见<body></body>主体内容 对用户可见- 注意层级关系
<head></head> <body></body>必须写在<html></html>标签中 - 头部内容 必须写在
<head></head>标签中 - 主体内容 必须写在
<body></body>标签中
例如
<!DOCTYPE html><html><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width;inital-scale=1.0" /><title>天天有个好心情</title></head><body><h2>我爱你中国</h2><!-- 这里可以给h2加个属性font-size 字体像素 --><h2 style="font-size:50px;">我爱你中国</h2><!--这样比上面的字体更大了 --></body></html>
详细内容如图
课外知识补充
markdown 添加网络图片方式
![avatar]()<!--()里面填写图片地址比如上面的图片在markdown里是这么写的""-->
关于网络文本中的字符
比如”<>””空格””&””双引号” 具有特殊意义，所以必须转义才允许添加到 html 文档中
- 常用转义字符表
| 序号 | 字符 | 描述 | 转义字符 | 实体编号 |
|---|---|---|---|---|
| 1 | ' ' |
空格 | nbsp; |
  |
| 2 | < |
小于 | < |
< |
| 3 | > |
大于 | > |
> |
| 4 | & |
&符号 |
& |
& |
| 5 | " |
双引号 | " |
" |
| 6 | © |
版权 | © |
© |
| 7 | ® |
已注册商标 | ® |
® |
| 8 | × |
乘号 | × |
× |
| 9 | ÷ |
除号 | ÷ |
÷ |
比如想在 HTML 中直接输出<html>这几个字 需要这么写< html >
这样在网页中显示为<html>
关于 文件夹与文件的命名
- 必须全部为小写字母 例 （china/index.html）
- 文件命名要规范 写.html 不要写.htm
- 分隔多个单词坚持用连接线”-“,不用下划线”_“
URL 是什么
- URL 是统一资源定位符，具有唯一性。互联网上所有文件都有唯一一个 url
URL 语法 ：模式/主机名/路径/文件名
|序号|名称|描述|举例|
|-|-|-|-|
|1|模式|也成为协议，浏览器如何访问以什么方式访问|http、https、ftp|
|2|主机名|以 ip 、域名表示，常用域名|https://127.0.0.1 为 ip 访问 https://www.baidu.con 为域名访问|
|3|路径|就是访问哪个文件夹，注意层级关系，是 a 文件夹里面的 b 文件夹，文件夹与文件夹中间用”/“分割|a/b/index.html|
|4|文件名|文件名必须加上后缀|.html、.php、.text、.png|绝对 URL 就是访问该文件的全部地址，引用本机或外部服务器上的文件
例如”https://www.php.cn/dugu/0401.html“相对 URL 是引用本机文件使用
例如”./dugu/0401.html”| 序号 | 使用场景 | 举例 |
| —— | ————————— | ——————————————————————————————————————————— |
| 1 | 引用同一目录下文件 | 直接写文件名,如demo2.html|
| 2 | 引用子目录下文件 | 目标文件前带上子目录名,使用目录分隔符/连接,如chapter2/demo2.html|
| 3 | 引用上层目录的文件 | 文件名前添加二个点,同样使用目录分隔符/连接,允许逐级向上查询,如../../demo2.html|
| 4 | 根路径/| 为防止过多层级的向上递归查询,可以从当前服务器根目录开始查询,如/admin/books/chapter2/|
html 的元素样式
- 浏览器本身有默认样式，但不同浏览器有不同的默认样式
所以我们要自定义元素样式来重置样式，以保证用户在不同的浏览器打开均可以看到相同的页面样式 - 自定义元素样式优先级大于默认样式
