• 03.TML基本标签_C


    在上一篇文章中讲了常规的布局类标签,本节来讲一下相关的网页内容展示类标签

    在讲到body标签时,曾讲到过,在body标签内展示的内容主要包括文字,图片,音频,视频内容, 今天讲的内容标签,主要基于这几个方面来讲,

    A: 文字类标签

         <p></p>标签: 用于展示一大段文字的标签,     

         <blockquote></blockquoted>标签: 用于展示大段的引用文字, 当引用古典、古籍或名人名言时,需要使用 blockquote标签

               (blockquote标签与p标签的用法基本一致,在展示效果上,blockquote标签会在左右做缩进展示)

          <span></span>标签: 用于标注小行文字的标签,  当需要在一大段文字中给某一行或多行文字进行标注或给这些文字配置一些不一样的展示效果时,可以使用span标签;

          <strong></strong>标签: 用于标注一大段文字中比较重要的文字,(span标签只是变更了样式,不存在重要性一说)

          <em></em>标签:作用与strong标签一样,但重要性没有strong大,em标签会产生文字的倾斜效果 (<i></i>标签也能产生倾斜效果,但与span一样,没有重要性一说)

          <a></a>标签: 用于跳转链接的文本标签; 

                --> a标签存在二个属性需要理解:  href="需要跳转的URL地址"; target="跳转链接地址后的打开方式"  

                      _blank: 在新的页面中打开链接内容;  _self:在当前页面中打开链接内容;

                -->  若使用了a标签,但没有配置href属性,a标签是没有效果的;

    ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

      B.图片标签

          <img>标签: img标签为单标签, 提供了四个属性

                  --> src="引用地址";   引用地址可以使用相对地址,也可以使用绝对地址 (这里的绝对地址是通过URL的方式来表达的绝对地址,不是电脑上哪个盘下面的哪个地址)

                       alt="图片名称";   搜索引擎在搜索图片时,就晃按这个图片名称来搜索的, 当图片下载失败而在原图片位置展示的文字,也是这个名称;

                       width, height: 图片实际的宽度和高度,尺寸为像素, 是图片原始的尺寸,不受展示的宽度和高度的影响;也不要写成展示在页面上的宽度和高度

                       (当然,如果你偏要去修改这个属性值,在不对img属性做任何限制的情况下,还是会存在一些尺寸上的变更效果,但最好不要这样去处理)
                       (对img内图片展示尺寸的应用,可通过其他样式的方式去进行控制)

                 --> 另外,需要了解一下什么叫做绝对路径,什么叫做相对路径; (在这里就不去过多的讲述这二个概念了,若有不清楚的,可以去百度一下)

                 --> 在相对路径的应用中, 需要理解 ./   ../    ../../这三个写法上的应用规则,

        C. 视频标签

             <video></video>标签: 通过 src进行视频来源的确定, 通过 controls="controls"来对控制区域的引用;      

        D. 音频标签

             <audio></audio>标签:  通过src进行音频来源的确定,controls="controls"来对控制区域的引用;

        

        

  • 相关阅读:
    HTML 标签元素的 align 属性
    JS计算时间差值
    ICPC Southeastern Europe Contest 2019 BDFIJ
    ICPC Latin American Regional Contests 2019 EGIKLM
    UCF Local Programming Contest 2017 ABCDEFGHI
    Codeforces #631 Dreamoon Likes Coloring
    Problem Palindrome
    Problem Toki’s function
    UCF “Practice” Local Contest — Aug 25, 2018 Boots Exchange 水题
    UCF “Practice” Local Contest — Aug 25, 2018 Rummy Score
  • 原文地址:https://www.cnblogs.com/jieling/p/10821713.html
Copyright © 2020-2023  润新知