1024,聊聊HTML

最新推荐文章于 2021-05-31 10:47:13 发布

炒番茄蛋的厨子

最新推荐文章于 2021-05-31 10:47:13 发布

阅读量518

点赞数 1

分类专栏： HTML 文章标签： 1024程序员节

本文链接：https://blog.csdn.net/qq_40862304/article/details/109255836

版权

HTML 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML（超文本标记语言）是一种用于创建网页的标准标记语言。 HTML 不需要编译，可以直接由浏览器执行，它的解析依赖于浏览器的内核。它不是一种编程语言，而是一种标记语言。

                                                                        
				  1111111             000000000           222222222222222                444444444  
				 1::::::1           00:::::::::00        2:::::::::::::::22             4::::::::4  
				1:::::::1         00:::::::::::::00      2::::::222222:::::2           4:::::::::4  
				111:::::1        0:::::::000:::::::0     2222222     2:::::2          4::::44::::4  
				   1::::1        0::::::0   0::::::0                 2:::::2         4::::4 4::::4  
				   1::::1        0:::::0     0:::::0                 2:::::2        4::::4  4::::4  
				   1::::1        0:::::0     0:::::0              2222::::2        4::::4   4::::4  
				   1::::l        0:::::0 000 0:::::0         22222::::::22        4::::444444::::444
				   1::::l        0:::::0 000 0:::::0       22::::::::222          4::::::::::::::::4
				   1::::l        0:::::0     0:::::0      2:::::22222             4444444444:::::444
				   1::::l        0:::::0     0:::::0     2:::::2                            4::::4  
				   1::::l        0::::::0   0::::::0     2:::::2                            4::::4  
				111::::::111     0:::::::000:::::::0     2:::::2       222222               4::::4  
				1::::::::::1      00:::::::::::::00      2::::::2222222:::::2             44::::::44
				1::::::::::1        00:::::::::00        2::::::::::::::::::2             4::::::::4
				111111111111          000000000          22222222222222222222             4444444444

一个网页的基本结构

<!DOCTYPE html>
<html>
  <head>
    <title>HTML 简介</title>
  </head>
  <body></body>
</html>

<!DOCTYPE html> 是我们的文档声明头。他告诉了浏览器，本文档处理的是 HTML 文档。html标签即根元素，此处表示文档的开始。head标签是网页的头部，设置网页的相关信息。title标签设置网页标题。body 标签定义文档的主体，也就是我们的主要内容。

常用HTML标签

标题标签
段落标签
图片标签
超链接标签
HTML 列表

1.标题标签

h 系类标签:有六种 h1，h2，h3，h4，h5，h6，它代表着我们的标题。

<!DOCTYPE html>
<html>
  <head>
    <title>HTML 简介</title>
    <meta charset="utf-8" />
  </head>
  <body>
    <h1>我是一级标题</h1>
    <h2>我是二级标题</h2>
    <h3>我是三级标题</h3>
    <h4>我是四级标题</h4>
    <h5>我是五级标题</h5>
    <h6>我是六级标题</h6>
  </body>
</html>

样式如下：

HTML 简介

我是一级标题

我是二级标题

我是三级标题

我是四级标题

我是五级标题

我是六级标题

2.段落标签

p 标签：文本标签。删掉上段代码标签里的内容，把下面的内容放到标签里面去。

<p>第一段文字，做实验，学编程</p>
<p>第二段文字，做实验，学编程</p>

样式如下

第一段文字，做实验，学编程

第二段文字，做实验，学编程

3.图片标签

图片标签，HTML 的图像是通过标签 <img>来定义的。语法: <img src="图片地址"/>。

样式如下

4.超链接标签

<a>标签是超链接标签，意思就是我们点击它可以跳转到一个网页。

样式如下：

这是一个超链接！！！！

5.HTML 列表

列表作为网页设计的重要内容之一，能够用来制作导航栏和新闻列表等。HTML 列表分为：有序列表（ol），无序列表（ul）以及自定义列表（dl）。
无序列表与有序列表

无序列表是一个项目的列表，此列项目使用实心圆、空心圆、方块进行标记，无序列表使用<ul> 标签。同样，有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于<ol>标签。每个列表项始于 <li>标签。

<p>无序列表</p>
<ul>
  <li>列表项1</li>
  <li>列表项2</li>
</ul>

<p>有序列表</p>
<ol>
  <li>列表项1</li>
  <li>列表项2</li>
</ol>

样式如下：

无序列表

列表项1
列表项2

有序列表

列表项1
列表项2

可以看到有多少个列表项就有多少个<li>标签。
无序列表和有序列表的 type 属性：
type 属性定义了列表项前项目符号的类型。
<ul> 标签的 type 属性：

值	备注
disc	（默认）实心圆
circle	空心圆
square	小方块

标签的 type 属性：

值	备注
1（默认）	数字表示（1，2，3…)
A	大写字母表示（A,B,C…)
a	小写字母表示（a,b,c…)
I	大写罗马数字表示(I,II,III…)
i	小写罗马数字表示(i,ii,iii…)