前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

4.HTML文本元素(html文档中的元素分为哪两个部分)

文本元素

  • 上节内容我们介绍了<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>
  • 使用以上学习的内容去实现这样的一个页面

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言