优秀的编程知识分享平台

网站首页 > 技术文章 正文

4.HTML文本元素（html文档的常用元素）

nanyue 2024-09-14 06:20:40 技术文章 10 ℃

文本元素

  • 上节内容我们介绍了<h1>标签，这个标签是表示一级标题，一级标题通常用于分割内容，每块内容需要一个一级标题去凸显内容，当然我们可以像创建<h1>标签一样创建二级标题一直到<h6>,如下图所示：
<!DOCTYPE html>
<html>
  <head>
    <title>HTML是最基本的网页语言</title>
  </head>
  <body>
    <h1>HTML是最基本的网页语言</h1>
    <h2>HTML是最基本的网页语言</h2>
    <h3>HTML是最基本的网页语言</h3>
    <h4>HTML是最基本的网页语言</h4>
    <h5>HTML是最基本的网页语言</h5>
    <h6>HTML是最基本的网页语言</h6>
  </body>
</html>
  • 在浏览器上面会给人一种视觉层次感‘
  • 上节我们也介绍了<p>标题，即段落标签，用法如下图所示：
<!DOCTYPE html>
<html>
  <head>
    <title>HTML是最基本的网页语言</title>
  </head>
  <body>
    <h1>代码介绍</h1>
    <p>劳拉·琼斯 (Laura Jones) 于 2027 年 6 月 21 日星期一发布</p>

    <h2>HTML是最基本的网页语言</h2>
    <p>
      所有现代网站和 Web 应用程序都是使用三个基础构建的 技术:HTML、CSS 和
      JavaScript。 这些是 网。
    </p>

    <p>
      在这篇文章中，让我们关注 HTML。 我们将了解 HTML
      的全部内容，以及为什么您也应该学习它。
    </p>

    <h3>什么是HTML?</h3>
    <p>
      HTML 代表超文本标记语言。 它是 Web
      开发人员用来构建和描述网页内容的标记语言（不是编程语言）。
    </p>
    <p>
      HTML 由描述不同类型内容的元素组成：段落、链接、标题、图像、视频等。Web
      浏览器理解 HTML 并将 HTML 代码呈现为网站。
    </p>
  </body>
</html>
  • 接下来，我们将学习如何加粗一段文本，很简单，通过<b>，我们只需要把想要加粗的文本放入此标签中即可，如下所示：
<p><b>劳拉·琼斯 (Laura Jones)</b> 于 2027 年 6 月 21 日星期一发布</p>

注意：b标签是较老的标签，在HTML5中，我们应该选择<strong>标签去加粗文字，因为b标签看上去毫无语义。但是使用strong标签就是让用户知道这个确实是一个很重要的文本。


<p><strong>劳拉·琼斯 (Laura Jones)</strong> 于 2027 年 6 月 21 日星期一发布</p>


  • 学会了加粗文本，接下来学习斜体，和b标签一样，之前只用i标签去表示斜体，但是在HTML5中使用em标签，因这个是有HTML语义的，意思是这个是一个强调的文本。如下所示：
<p>
      所有现代网站和 Web 应用程序都是使用三个<em>基础构建</em>的技术:HTML、CSS 和
      JavaScript。 这些是网站的语言。
    </p>
  • 使用以上学习的内容去实现这样的一个页面

Tags：

猜你喜欢

最近发表
标签列表