HTML_基础

程序员浩浩
141 阅读3分钟

HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。
超文本是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中，也可能是其他文件，或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接，为人们查找，检索信息提供方便。

1. 网页是什么

网页的本质就是html文件，这个文件是由.txt通过修改后缀名得到的！！
想要创建网页，就需要，新建一个文本文档，单后修改后缀为 .html

1.1. 如何创建一个网页文件

在我们的电脑上新建一个文本文档
image.png
新建完成后，获得一个文本文档
image.png
然后重命名，修改名字为 自定义的名字.html重要！！！一定要记住，后缀名要写对。
image.png

在进行操作前，记得开启后缀名显示

baijiahao.baidu.com/s?id=171618…
如果我们不想显示后缀，可以在VSCode中进行文件新建操作

1.2. 网页中的内容由什么组成

image.png
假如我们想要创建一个自己的网页，通过1.1的内容可以创建。如何才能在里面写内容呢。
我们在网页中，写入内容
通过VSCode打开网页，然后写进入一句话这是我的第一个网页
然后双击打开我们的网页。
打开后页面上展示
image.png
但是我们查看了一些实际的内容，是下面的内容
image.png
我们的网页是有一个固定结构的。

1.3. 如何使用VSCode生成网页的固定结构

既然每个网页都由一个固定的结构，所以未来我们只要创建一个html都进行一个操作，生成固定结构。
在HTML文件中，输入 !注意是半角符号，然后按Tab键（制表符）然后就会生成固定结构

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

2. 什么是标签

了解HTML的基本结构，我们发现在这个固定结构上有很多的代码。这些代码有什么公共的写法吗？

2.1. 标签名

标签就是由尖括号包裹标签名组成的内容

<标签名>
<标签名></标签名>

上面的写法中，我们称单标签和双标签。
当别人告诉我们有某个标签时，我们要能够通过标签名写出来他的结构。

2.2. 属性

HTML的属性是写在开始标签里的，在标签名之后要有一个空格，属性可以有多个，然后属性之间用空格隔开，格式为属性="属性值"

<标签名 属性="属性值">
<标签名 属性="属性值" 属性2="属性值"></标签名>

有些属性，只有属性名，没有属性值

<标签名 属性>
<标签名 属性 属性2></标签名>

2.3. 内容

标签中可以包裹内容，只有双标签才能包裹内容！！！！不只是文本可以被包裹，其他标签也可以被包裹。

<标签名> 内容 </标签名>

<标签名>
  内容  
</标签名>

<标签名>
  <其他标签>  
</标签名>
  • 所有的里面代码都被<>包裹起来了
  • 有的有两个后面的一个带 / 有个只有一个
  • 一个标签可以出现多次

2.4. 在VSCode中怎么写标签最合适

直接输入标签名，然后按tab，快速生成标签已经标签所需的属性。

avatar
文章
阅读
粉丝