一.网页固定格局

1.编写网页的步骤:

  • 新建一个文本文档
  • 利用记事本关上
  • 编写THML代码
  • 保留并且批改纯文本文档的扩大名为.html
  • 利用浏览器关上编写好的文件

1.1 WebStorm常见快捷键

  • 如何在WebStorm中利用快捷键创立一个新的.html的文件

    • 同时按下键盘上的Ctrl + Alt + Insert

  • 如何在WebStorm中让光标挪动到以后行的开端

    • 按下键盘上的End键即可

  • 如何在WebStorm中让光标挪动到以后行的最后面

    • 按下键盘上的Home键即可

  • 如何在WebStorm中让光标在多行中闪动

    • 按住键盘上的Alt键不放, 而后再按住鼠标的左键不放, 而后再拖动鼠标即可

  • 如何在WebStorm中疾速的复制光标所在的那一行

    • 按下键盘上的Ctrl + D

  • 如何在WebStorm中疾速的删除光标所在的那一行

    • 按下键盘上的Ctrl + X

  • 如何在WebStorm中让标签包裹一段内容, 也就是主动在一段内容前后加上标签

    • 按下键盘上的Ctrl + Alt + T, 而后按下回车, 而后输出对应的标签即可

2.网页根本构造

<html lang="en"><head>    <meta charset="UTF-8">    <title>音视频测试</title></head><body></body></html>
  • 通过观察咱们发现, HTML根本构造中所有的标签都是成对呈现的, 这些成对呈现的标签中有一个带/有一个不带/, 那么这些不带/的标签咱们称之为开始标签, 这些带/的咱们称之为完结标签

二.网页标签

1.HTML标签

  • 作用: 用于通知浏览器这是一个网页, 也就是说通知浏览器我是一个HTML文档
留神点: 其它所有的标签都必须写在html标签外面, 也就是写在html开始标签和完结标签两头

2.head标签

  • 作用:
    用于给网站增加一些配置信息

  • 例如:

    • 指定网站的题目 / 指定网站的小图片
    • 增加网站的SEO相干的信息(指定网站的关键字/指定网站的形容信息)
    • 外挂一些内部的css/js文件
    • 增加一些浏览器适配相干的内容
留神点:
个别状况下, 写在head标签外部的内容都不会显示给用户查看, 也就是说个别状况下写在head标签外部的内容咱们都看不到

3.title标签

  • 作用:
    专门用于指定网站的题目, 并且这个指定的题目未来还会作为用户保留网站的默认题目
留神点:
title标签必须写在head标签外面

4.body标签

  • 作用:
    专门用于定义HTML文档中须要显示给用户查看的内容(文字/图片/音频/视频)
留神点:
尽管说有时候你可能将内容写到了别的中央在网页中也能看到, 然而千万不要这么干, 肯定要将须要显示的内容写在body中
一对html标签中(一个html开始标签和一个html完结标签)只能有一对body标签

5.meta标签

  • 作用 : 在编写网页的时候指定字符集,可避免出现乱码景象
<meta charset="UTF-8">

GBK(GB2312)和UTF-8区别

  • GBK(GB2312)外面存储的字符比拟少, 仅仅存储了汉字和一些罕用外文
    体积比拟小
  • UTF-8外面存储的世界上所有的文字,提交比拟大

集体举荐:所有一律都写UTF-8

三.HTML标签分类

1.单标签

  • 只有开始标签没有完结标签, 也就是由一个<>组成的
<meta charset="UTF-8" />

2.双标签

  • 有开始标签和完结标签, 也就是由一个<>和一个</>组成的
<html></html>

四.HTML标签关系分类

1.并列关系(兄弟/平级)

<head></head><body></body>

2.嵌套关系(父子/上下级)

<head>      <meta charset="UTF-8" />      <title>音视频测试</title></head>