HTML实例解析：标题&段落&超链接&图片

最新推荐文章于 2024-03-23 23:48:47 发布

土妮子

最新推荐文章于 2024-03-23 23:48:47 发布

阅读量917

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_44771312/article/details/99441549

本文详细介绍了HTML的基础知识，包括如何创建简单的HTML文档，使用<h1>到<h6>定义标题，用<p>标签定义段落，通过<img>标签插入图片并调整尺寸，以及利用<a>标签创建超链接。这些基本元素构成了网页内容的基本框架。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML标签

HTML标记标签通常被称为 HTML 标签 (HTML tag)。

HTML标签是由尖括号包围的关键词，比如 <html>

HTML标签通常是成对出现的，比如 <b> 和 </b>

标签对中的第一个标签是开始标签，第二个标签是结束标签

开始和结束标签也被称为开放标签和闭合标签。

<标签>内容</标签>

简单的HTML文档实例：

<html>
    <head>
        <meta charset="UTF-8"/>
        <tittle>天气预报</tittle>
    </head>
    <body>
        <h1>我的标题</h1>
        <p>天清气朗</p>
    </body>
</html>

运行显示：

实例解析

<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题
<p> 元素定义一个段落

HTML标题

HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的.

<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>

结果

从h1到h6是六种标题的格式

HTML水平线

<hr> 标签在 HTML 页面中创建水平线。

HTML注释

可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。

浏览器会忽略注释，也不会显示它们。

HTML段落

HTML 段落是通过标签 <p> 来定义的.

<p>这是一个段落。</p>
<p>这是一个段落。</p>
<p>这是一个段落。</p>

结果

段落空格使用&nbsp

段落换行使用<br/>

HTML图片

HTML 图像是通过标签 <img> 来定义的.

<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。

要在页面上显示图像，你需要使用源属性（src）。src 指 "source"。源属性的值是图像的 URL 地址。

alt 属性用来为图像定义一串预备的可替换的文本。

替换文本属性的值是用户定义的。

height（高度）与 width（宽度）属性用于设置图像的高度与宽度。

<img src="/images/logo.png" alt="Big logo" width="258" height="39" />

HTML超链接

HTML 链接是通过标签 <a> 来定义的。（在 href 属性中指定链接的地址）

<a href="//www.taobao.com">淘宝网</a>