基本骨架标签,段落、换行、水平标签,文本标签(HTML)

8,596次阅读
没有评论

共计 1175 个字符,预计需要花费 3 分钟才能阅读完成。

一、基本骨架标签

HTML 文件最基本的 四个标签,组成了网页的基本骨架。基本骨架标签有:

标签

作用:定义 HTML 文件的根元素,是网页中最大的标签,表示整个的 HTML 文档,所有的标签要书写在标签内部。

标签

作用:用于存放

 <meta>  <base>  </p> <style>  <script>  <link>。内部用于对网页的设置,除了内部的文字,其他标签都不显示在浏览器上。</p> <p><span>Tips:在 <head> 标签中必须要设置的标签是 title。</p> <h4><span><title>标签 </p> <p>作用 1:让页面拥有一个属于自己的标题。如果不写 title 不写网页标题,会自动以编写代码的文件名作为网页标题,这是不合理的,所以 title 一般都要书写。</p> <p>作用 2:title 中的关键字可以作为搜索引擎抓取时的关键字,提高 SEO 搜索引擎优化。</p> <p>作用 3:内部的内容会显示在搜索结果的标题部分。</p> <p>作用 4:作为浏览器收藏夹默认的网页标题。</p> <p><span>Tips:建议网页必须添加 title 标签内部内容,内容尽量精简,提取网页的关键字。</p> <h4><span><body>标签 </p> <p>定义网页的主体部分,用于存放所有的 HTML 显示内容的标签,</p> <p>  </p> <h1>  <a>  </p> <div> 等 </p> <p>body 内部的元素内容会显示在浏览器的窗口中。</p> <p>四者关系如图所示:</p> <p><img title="基本骨架标签,段落、换行、水平标签,文本标签(HTML)" alt="基本骨架标签,段落、换行、水平标签,文本标签(HTML)" fetchpriority="high" decoding="async" alt=""height="338"data-src="https://yojack.cn/wp-content/uploads/replace/15dc17548b975e9a15ed1ce86b74112e.jpeg"data-lazy="true"src="https://yojack.cn/wp-content/themes/wordpress-theme-puock-master/assets/img/z/load.svg"width="1200"/> </p> <p><html>作为祖先级,内部 <span> 嵌套了 <head> 和<body>,而 <head> 又<span>嵌套了<title> </p> <h2><strong>二、段落、换行、水平标签 </p> <h4><span><strong>段落标签 </p> <p>在网页中,要把文字有条理地显示出来,就需要将这些文字分段显示。在 HTML 标签中,<code></p> <p>标签用于定义段落,它可以将整个网页分为若干个段落。</p> <p><strong>示例代码 </p> <pre><code class="hljs"><p>这是第一个段落 <p>这是第二个段落 <p>为文本分段可以使用段落标签<code><p> 包裹需要放在一段的文字 <p><strong>运行结果 <p><span>这是第一个段落 <p><span>这是第二个段落 <p><strong>示例代码 <pre><code class="hljs"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>段落标签</style>

这是第一个段落

当前段落内容 第二行内容

这是第二个段落

当前段落内容 第二行内容

运行结果

这是第一个段落

当前段落内容 第二行内容

这是第二个段落

当前段落内容 第二行内容

换行标签

在 HTML 中,常见用
标签表示换行,也可以用
标签,但是不规范

示例代码




    
    
    段落标签


    这是第一句话,接下来需要换行 
已经换行

运行结果

这是第一句话,接下来需要换行

已经换行

水平标签

在 HTML 中,使用


标签可以在网页上实现水平分割线的效果

示例代码




    
    
    水平线标签测试


    

当前标签下面的横线为水平线


这是分割线下方的测试文本

运行结果

基本骨架标签,段落、换行、水平标签,文本标签(HTML)

三、文本标签

 网页制作过程中,需要通过文本和段落的排版制作出网页。以下是一些常用的文本与段落排版所使用的标签

h 标签

示例代码





    
    
     h 标签



    

第一个标题

第二个标题

第三个标题

第四个标题

第五个标题
第六个标题

运行结果

基本骨架标签,段落、换行、水平标签,文本标签(HTML)

文本格式化标签

加粗: 标签 和 标签(strong 定义强调文本,b 定义文本粗体)

倾斜: 标签 和 标签(em 定义强调文本,i 定义斜体字)

删除线: 标签 和 标签(HTML5 不赞成使用 s)

下划线: 标签 和 标签(HTML5 不赞成使用 u)

示例代码





    
    
     h 标签



    

现实中编排文本的常用标签


我是默认文本


我是加粗文本


我是倾斜文本


我是删除线文本


我是下划线文本


运行结果

基本骨架标签,段落、换行、水平标签,文本标签(HTML)

以上就是我与大家分享的所有内容,希望对大家有所帮助。若有疑问和建议欢迎在评论区留言,大家一起探讨!

原文地址: 基本骨架标签,段落、换行、水平标签,文本标签(HTML)

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2024-10-27发表,共计1175字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)