常见html标签详解(1)

常见html标签有标题,文字加粗倾斜,段落,注释,超链接,图片,视频,音频等,下面详细介绍一下他们:

    h(标题)标签:使用<h1>至<h6>标签进行定义。<h1>定义最大的标题,<h6>定义最小的标题。
         权重依次为h1>h2>h3....类推,在做H标签的时候一定要注意切勿把H标签用在LOGO上面,还有就是注重在页面当中出现的次数,不易过多(SEO)。

    Strong(加粗)标签,Em(倾斜)标签:对于网站而言这两种标签的作用非常类似,它们都是对网页内容当中的重要关键词来进行加强突出,让搜索引擎更为重视(SEO)。

    a(定义超链接)标签:可以让我们从一个页面跳转到其他页面或者是当前页面的其他位置(行内元素)。
         跳转到其他页面:
              ①属性:href 指定跳转的目标路径
                   --值可以是一个外部网站的地址
                   --也可以写一个内部页面的地址
              ②属性:target 指定超链接打开的位置
               --self 默认值 在当前页面中打开超链接
               --blank 在一个新的页面中打开超链接
              另外超链接也是一个行内元素,在a标签中可以嵌套除它自身以外的任何元素
        当前页面的其他位置:
             ①可以直接将超链接的href属性设置为#,这样点击超链接以后页面不会发生跳转,而是转到当前页面的顶部位置
             ②可以跳转到页面的指定位置,只有将href属性设置#加目标元素的id属性值(相当于锚点)
               --id属性(唯一不重复的)
                  Ⅰ :每一个标签都可以添加一个id属性
                  Ⅱ:id属性就是元素的唯一标识同一个页面中不能出现重复的id属性值,如同身份证一样
             ③可以使用 javascript:;来作为href的属性,此时点击这个超链接什么也不会发生(相当于做占位符使用)

    注释<!--HTML-->/*css*/标签:注释的内容会被浏览器忽略,不会在网页中直接显示,但可以在源码中查看注释,注释用来对代码进行解释说明,注释还可以将一些不希望显示的内容隐藏,另外注释不能嵌套(浏览器自上而下解析遇到注释结束标签-->或*/会与系统会误认为和最开始注释配成一对)。

    img(图片)标签:图片标签用于向当前页面引入一个外部图片(该标签为自结束标签,行内块状元素)
         属性:
          src 指定的是一个外部图片的路径(路径规则和超链接是一样的)
          alt 图片的描述,这个描述默认情况下不会显示,有些浏览器图片会无法加载时显示,搜索引擎会根据alt中的内容来识别图片,如果不写alt属性则图片不会被搜索引擎所解析
          width 图片的宽度(单位是像素)
          height 图片的高度(单位是像素)
               --宽度和高度中如果只修改一个,则另一个会等比例缩放
          注意:
               一般情况下在pc端,不建议修改图片大小,需要多大图片就裁多大,但是在移动端,经常需要对图片进行缩放(大图缩小)
    图片的格式:
          jpeg(jpg)
               -支持的颜色比较丰富,不支持透明效果,不支持动图
               -一般用来显示照片
          gif
               -支持的颜色比较少,支持简单透明,支持动图
               -颜色单一的图片,动图
          png  
               -支持的颜色丰富,支持复杂透明,不支持动图
               -颜色丰富,复杂透明图片(专为网页而生)
          webp
               -这种格式是谷歌新推出的专门用来表示网页中的图片的一种格式
               -它具有其他图片格式的所有优点,而且文件还特别的小
               -缺点是兼容性不好

          base64(图片转换)
               -将图片使用base64编码,这样可以将图片转化为字符,通过字符的形式引入图片
               -一般都是一些需要和网页一起加载的图片才会使用base64


    总之原则:效果一样用小的,效果不一样用好的

    audio(音频) video(视频)标签:用来向页面中引入一个外部的音频文件,音视频文件引入时,默认情况下不允许用户自己控制播放停止。
     
         属性:
          src 指定的是一个外部文件的路径
          controls:是否允许用户控制播放
          autoplay:音频文件是否自动播放
               -如果设置了autoplay则音乐在打开页面时会自动播放,但是目前大部分浏览器都不会自动对音乐播放
          loop:循环播放
示例:


猜你喜欢

转载自blog.csdn.net/no15870678621/article/details/107887243