学HTML的第一天

最新推荐文章于 2024-10-08 22:29:57 发布

金丝先生

最新推荐文章于 2024-10-08 22:29:57 发布

阅读量92

点赞数

分类专栏：前端文章标签： html html5

本文链接：https://blog.csdn.net/weixin_42643070/article/details/118584460

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1、什么是 HTML？

HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

HTML 文档 = 网页

HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容

2、HTML的语法规范

2.1、基本语法

（1）HTML标签通常是由尖括号包围的关键词，如
（2）HTML标签通常成对出现，为双标签，如
（3）有些特殊标签为单表签

2.2、标签关系

（1）包含关系
（2）并列关系

2.3、HTML基本结构标签

<!DOCTYPE html> # 文档声明标签，必须放在第一行
<html lang="en"> # lang为language的缩写，表名当前html文档使用的语言。en为英文，zh-CN为中文。主要作用是声明此文档语言。对浏览器和搜索引擎是起作用的。

<head>
    <meta charset="UTF-8"> # charset为字符编码
    <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>

3、HTML常用标签

3.1、标题标签

从<h1></h1>到<h6></h6>共6个等级，从大到小，双标签

<h1>最大标签</h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6>最小标题</h6>

3.2、段落和换行标签

<p>分段标签</p>段落标签paragraph，双标签

<p>abcdefg</p>hijk

<br />换行标签break，单标签

<p>abcdefg</p>hi<br />jk

换行标签只换行，不空行。段落标签换行且空一行。

3.3、文本格式化标签

<strong></strong> 加粗标签，加粗字体(或<b></b>)
<em></em> 斜体标签，使字体倾斜(或<i></i>)
<del></del> 删除线标签，字体上有删除线(或<s></s>)
<ins></ins> 下划线标签，字体有下划线(或<u></u>)

<strong>你以为我贫穷、相貌平平就没有感情吗?</strong>
<em>我向你发誓</em>，如果上帝赋予我财富和美貌，
<del>我会让你无法离开我</del>，就像我现在无法离开你一样。
<ins>虽然上帝没有这么做</ins>，可我们在精神上依然是平等的。

3.4、盒子标签

<div></div>和<span></span>是没有语义的，它们就是一个盒子，用来装内容的。
div 是 division 的缩写，表示分割、分区。span 意为跨度、跨距。

<div> 标签用来布局，但是现在一行只能放一个<div>。
<span> 标签用来布局，一行上可以多个 <span>。

3.5、图像和路径标签

<img> 标签，用于引用定义图像，单标签

属性	属性值	说明
src	图片路径	必须的属性
alt	文本	替换文本。图像不能显示的文字
title	文本	提示文本。鼠标放到图像是显示的文字
width	像素	设置图像宽度
height	像素	设置图像高度
border	像素	设置图像边框粗细