博客列表 >HTML基础知识

HTML基础知识

海阔天空
海阔天空原创
2020年04月03日 15:47:34940浏览

HTML 基础知识

1.什么是 HTML

  1. 超文本标记语言(英语:HyperText
  2. MarkupLanguage,简称:HTML)是一种用于创建网页的标准标记语言。 可以使用
  3. HTML来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。

2.HTML 是用来描述网页的一种语言

  • HTML 指的是超文本标记语言: HyperText Markup Language
  • HTML 不是一种编程语言,而是一种标记语言
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页
  • HTML 文档包含了 HTML 标签及文本内容
  • HTML 文档也叫做 web 页面

3. 网页的组成部分

序号 内容 描述
1 文本内容 用户看到的网页文本,例如新闻,电话等
2 其它文件的引用 如图片,视频,音频,CSS 样式表,JS 脚本等
3 标记 对文本以及引用文件的正确描述
  • 每个页面都是由这三部分组成的, 并且都是采用纯文本进行描述
  • 意味着任何能编写纯文本的编辑器都可以用来创建 HTML 页面
  • 现在主流 HTML 版本是 5.0,后面的教程默认就是 HTML5 版本

4. html 设计思想

  • html 文档中的一切,都是基于标签实现的
  • 标签就类似于超市中玲琅满目的商品,你能通过一个标签快速识别并找到它们
  • 页面中的每一块内容,如果想识别出来,同样也需要给他们贴上不同的标签
术语 描述
超文本 是指包含有超链接的文本
标记 就是用来描述内容的固定标签
语言 html 并不编程语言,只是书写 html 文档的工具

5.HTML 标签

  • HTML 标记标签: 通常被称为 HTML 标签 (HTML tag)。
  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如<b></b>
  • 标签对中的第一个标签是起始标签,第二个标签是结束标签

    1. HTML标签 示例:
    2. <标签>内容</标签>

6.HTML 元素

严格来讲, 一个 HTML 元素包含了开始标签与结束标签,包含属性等设置,如下实例:
  1. HTML元素 示例: <a href="https://www.baidu.com">这是一个超链接!</a>
元素 标签 语法 描述
非空元素 双标签 <p>学习让我变得更强大</p> <起始标签>元素内容</结束标签>
空元素 单标签 `<img src="..." alt=""> <link>` <标签>

7. 属性和值

基本语法
  • 属性: 必须写到元素的 “起始标签” 中,由属性名和属性值二部分组成
  • 语法: 属性名="属性值",属性名推荐只使用小写字母,属性值推荐加上双引号
  • 案例: <input type="password" maxlength="20" placeholder="至少8个字符" required>
序号 值类型 描述
1 字符串 <p class="active">...</p>
2 预定义值 <input type="text">
3 指定格式 <a href="https://php.cn">...</a>
4 数值 <table width="200">...</table>
5 布尔值 <input type="email" required>

布尔属性的值是可选的, 只要元素中出现该属性,表示它取

8. Web 浏览器

Web 浏览器(如谷歌浏览器,IE,Firefox,Safari)是用于读取 HTML 文件,并将其作为网页显示。浏览器并不是直接显示 HTML 的标签,但可以使用标签来决定如何展现 HTML 页面的内容给用户。

9.URL 统一资源定位符

  • 统一资源定位符(Uniform Resource Locator,URL)是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址。
  • 基本 URL 包含模式(或称协议)、服务器名称(或 IP 地址)、路径和文件名,如“协议://授权/路径?查询”。

9.1 类别划分

  • 绝对 URL
    绝对URL(absolute URL)显示文件的完整路径,这意味着绝对URL本身所在的位置与被引用的实际文件的位置无关。
序号 使用场景 举例
1 被引用目标与当前位置无关 http://php.cn/courses/123.html
2 引用其它服务器上的文件 https://www.php.net/manual/zh/
  • 相对 URL
    相对 URL(relative URL)以包含 URL 本身的文件夹的位置为参考点,描述目标文件夹的位置。如果目标文件与当前页面(也就是包含 URL 的页面)在同一个目录,那么这个文件的相对 URL 仅仅是文件名和扩展名
    如果要引用文件层次结构中更高层目录中的文件,那么使用两个句点和一条斜杠。可以组合和重复使用两个句点和一条斜杠,从而引用当前文件所在的硬盘上的任何文件.
序号 使用场景 举例
1 引用同一目录下文件 直接写文件名,如demo2.html
2 引用子目录下文件 目标文件前带上子目录名,使用目录分隔符/连接,如chapter2/demo2.html
3 引用上层目录的文件 文件名前添加二个点,同样使用目录分隔符/连接,允许逐级向上查询,如../../demo2.html
4 根路径/ 为防止过多层级的向上递归查询,可以从当前服务器根目录开始查询,如/admin/books/chapter2/

访问同一个网站的文件,应该始终坚持使用相对 URL 地址

9.2 模式/协议

最常用的模式是超文本传输协议(Hypertext Transfer Protocol,缩写为HTTP),这个协议可以用来访问网络。

协议 描述
http 超文本传输协议资源
https 用安全套接字层传送的超文本传输协议
ftp 文件传输协议
mailto 电子邮件地址
file 当地电脑或网上分享的文件
telnet Telnet 协议
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议