HTML学习 1

1 主体架构 （可在VSCode上！+Tab键快速生成）

<html>  <!-- 根标签（元素），网页中所有内容都要写在元素的里面 -->
      
      <head> <!--head是网页得头部，head中的内容不会显示在网页中，主要用来帮助浏览器或搜索引擎来解析网页 -->

            <title>这里是网页名称</title>  <!--网页的标题-->

      </head>

      <body>  <!-- 网页的主体 -->

             网页内容

      </body>

</html>

2 文档的声明 <!doctype html> 放在根标签的外部，整段代码的开头

3 段落标签 <p> </p>

4 自结束标签 <img> <input>等不需要成对出现

5 注释

6 各级标题 <h1> 一级标题 </h1> 网页的大标题同理<h2> </h2>...

7 标签中的属性

<h3>这是我的<font color="blue" size="10">第一个网页</font></h3>

8 避免乱码 <meta charset = "UTF-8" > 写在<head>标签中

9 实体（转义字符）

在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格

在HTML中有些时候，我们不能直接书写一些特殊符号，比如多个连续的空格，比如字母两侧的大于和小于号

如果我们需要在网页中书写这些特殊的符号，则需要使用HTML中的实体

& 实体的名字 ；

例如  空格 >大于号 < 小于号

10 meta标签

meta标签主要用于设置网页中的一些元数据，元数据不是给用户看

charset:设置字符集，防止乱码问题

<meta charset = " UTF-8 ">

name：keywords description author

（1）keywords 关键词

例如在百度上搜索购物就会出现京东、淘宝等，因为购物是京东等网页的关键词

可同时使用多个关键词，中间用逗号隔开

（2）description 网页的描述

<head>
    <meta charset="UTF-8">
    <meta name="description" content="Free Web tutorials">
    <meta name="keywords" content="HTML,CSS,XML,JavaScript">
    <meta name="author" content="Hege Refsnes">
</head>

http-equiv:将页面重定向到另一个网站

例如在 3 秒后，跳转到百度界面：

<meta http-equiv = "refresh" content = "3 ; url ="https://www.baidu.com" >