HTML零基础入门（简单易懂）

FFNCL

于 2024-08-21 12:43:34 发布

阅读量337

点赞数 9

文章标签： html5

本文链接：https://blog.csdn.net/FFNCL/article/details/141361146

版权

1.HTML介绍

HTML 指的是超文本标记语言: HyperText Markup Language，是一种用于书写描述网页的语言，是Web上通用的标记语言，允许对文本、图片、音频等进行操作，HTML文档也叫做web网页。

2.基本格式

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZONGXP</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>

格式说明：HTML中的标签大多数是双标签，以<html>开始，<\html>结束，<html>表示为HTML文本语言的标志

3.常见标签

标签	标签解析	举例
<h> </h>	标题标签，有h1-h6共6个标签，大小不一样	<h1>这是一个h1标签<\h1>
<p> </p>	段落标签	<p>此处内容为一个段落<\p>
<a> </a>	链接标签，用于打开其他的链接	<a href='URL链接的地址'><\a>
<img src='' ">	图像标签，用于插入图像	<img src='图像地址'>
<video src=""></video>	视频标签，用于插入视频	<video src="URL"> </video>
<audio src=""> </audio>	音频标签，用于插入音频	<audio src="URL"> </audio>
<table> </table>	表格标签，<tr></tr>为表格的行标签，<td></td>为单元格标签,<th></th>为表头标签
<body></body>	文本标签
<br>	换行标签，用于换行
<hr>	水平线标签，用于添加水平线
<!-- -->	注释标签，用于注释。Ctrl+/可以快速生成和取消注释

4.列表标签

有序列表ul
```
<ul>
    <li></li>
    <li></li>
</ul>
```
无序列表ol
```
<ol>
    <li></li>
    <li></li>
</ol>
```

定义列表
dl嵌套dt和dd
    dl是定义列表,dt是定义列表的标题,dd是定义列表的描述
<dl>
  <dt>项目 1</dt>
    <dd>描述项目 1</dd>
  <dt>项目 2</dt>
    <dd>描述项目 2</dd>
</dl>

5.表格详解

框架
<table>
  <tr>
    <th>标题</th>
  </tr>
  <tr>
    <td>内容</td>
  </tr>
</table>

表格结构标签
    thead       表格头部      表格头部内容
    tbody       表格主体      主要内容区域
    tfoot       表格底部      汇总信息区域

6.框架

框架标签
- <frame name="f1" src="a.html" scrolling="auto" noresize="noresize"/>
- src 属性设置框架中要显示的网页的URL地址
- name 属性设置框架名称、来唯一标识框架
- scrolling 属性设置框架是否显示滚动条，属性值可为：yes、no、auto
- noresize 属性设置是否可以调整窗口大小，属性值只可取：noresize

浮动框架标签iframe:可以嵌在网页中任意部分的框架形式
    <iframe src="aa.html" id="iframe1" width="100" height="100" frameborder="1" scrolling="auto"></iframe>
        src 设置框架中要显示的网页的URL地址
        id 用于唯一标识 iframe 框架
        width 设置浮动框架的宽度
        height 设置浮动框架的高度
        frameborder 设置是否显示边框，0 为不显示，1 为显示
        scrolling 设置是否显示滚动条，属性值可为：yes、no、auto