欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

HTML入门知识(1)

程序员文章站 2024-01-26 12:18:04
...

一、HTML简介

1.HTML是什么?

HTML:hyper text markup language超文本标记(标签)语言由各种标签组成,用来制作网页,告诉浏览器该如何显示页面

2.作用

  • 制作网页,控制网页和内容的显示
  • 插入图片、音乐、视频、动画等多媒体
  • 通过链接来检索信息
  • 使用表单获取用户的信息,实现交互

3.版本

W3C.world wide web consortium万维网联盟,制定Web技术相关标准和规范的组织,HTML就是由W3C制定的标准

两个版本:HTML 4.0.1、HTML 5.0-----通常H5

官网:http://www.W3shcool.com.cn

4.扩展名

HTML文档是以.html或.htm结尾

二、HTML文档结构

1.基本结构

1.1简介

  • HTML标签是由尖括号括起来的关键词,如<html>,通常是成对出现的,如<html> </html>
  • <html>为根标签,包含:<head>头部和<body>主体部分
  • 头部提供关于网页的相关信息,如标题、文档类型、字符编码、关键字等摘要信息
  • 主体部分提供网页的显示内容,真正显示在页面中的内容
  • 合理地进行缩进
  • 标签名不区分大小写,但是一般要用小写

1.2开发工具

记事本notepad、sublime、Notepad++、Dreamweaver、VScode、Webstorm等

使用步骤:

1.新建文件(ctrl+N),然后保存(ctrl+s),指定扩展名为.html

2.编写HTML代码

3.在浏览器中打开

使用技巧:

  • 先保存再写代码,否则代码无颜色提示
  • 创建一个文件夹,用于保存所有的网页内容,将文件夹拖拽到sublime中,便于管理
  • 显示/隐藏侧边栏
    方式1:查看–>侧边栏–>显示/隐藏侧边栏
    方式2:ctrl+k紧接着按B
  • 显示多栏
    方式1:查看–>布局–>列数:2列
    方式2:Alt+shift+2

1.3浏览器

常见的浏览器:IE浏览器微软、chrome谷歌浏览器、firefox火狐、safari苹果

浏览器的作用是读取html文件,并以网页的形式来显示

浏览器不会直接显示html标签,而是使用标签来解释网页的内容

2.标签

2.1 标签的形成

一个完整的html标签的形成:

<标签名 属性名=“属性值”>内容</标签名>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>标签</title>
</head>
<body  bgcolor="red"  text="blue">
	html从入门到精通!
</body>
</html>

属性值要用双撇号括起来,一般用双撇号

2.2 标签的分类

根据标签是否关闭,分为,关闭型和非关闭型

  • 关闭型:有结束标签,即标签成对出现
    <html></html>
    <head></head>
    <title></title>
  • 非关闭型:没有结束标签
    <meta>
    <br>
    <h1><h6>

根据标签是否独占一行,分为块级标签和行级标签

  • 块级标签:显示为块状,独占一行

    <h1>大家好</h1>
    <hr>

  • 行级标签:在行内显示,可与其他内容在同一行显示
    <span></span>
    HTML入门知识(1)

2.3 注释

注释在浏览器中是不会显示的,是用来标注解释html语句,但通过查看源代码的方式可以看到

语法:

<!--注释内容-->

2.4 实体字符

也称为特殊字符,用于显示一些特殊符号,如:<> & 空格等

语法:

<&实体字符的名称>;

常见的实体字符:

&lt;        <    小于号    less than
&gt;        >    大于号    great than
&nbsp;        空格     space   在html中对于连续的空白字符(包括空格、换行、TAB等),在浏览器中显示为一个空格
&amp;      &   与
&quot;     "   双引号
&copy;     ©   版权符号   copyright
&reg;      ®   注册符号   register
&times     ×   关闭按钮

2.5 文档类型

在html文档的第一行,使用<!DOCTYPE HTML>声明HTML文档的类型用来告诉浏览器页面的文档类型,简单来说,用来指定html版本的规范

目前基本上最常用的html5,<!DOCTYPE HTML>