zoukankan      html  css  js  c++  java
  • HTML中的img标签讲解(菜鸟)

    HTML中的img标签:

      1.img标签中的img其实就是英文image的缩写

        img标签的作用就是告诉浏览器我们需要显示一张图片。

      2.img标签格式:<img src="">

        其实img标签中的src是英文source的缩写

        所以img标签中的src就是用来img标签,需要显示的图片名称

    <img src="当前电脑图片的路径" />

      3.注意点

        -和h系列标签/p标签还有hr标签不一样,img标签不会独占一行

        -如果我们手动指定了img标签显示的图片的宽度和高度,

        有可能会导致图片变形,那么如果又想指定宽度和高度,

    <img src="当前电脑图片的路径" width="200px" height="200px" />

        又不想让图片发生变形,我们可以只指定宽度或者高度其中的一个值即可

        -只要指定了宽度,系统会自动根据宽度计算出高度,

        只要指定了高度,系统会自动根据高度计算出宽度,

           并且都是等比拉伸的,也就是说不会变形

    <img src="当前电脑图片的路径" width="200px" />
    <img src="当前电脑图片的路径" height="200px" />

      4.width:宽度

      height:高度

      所以在img标签中width/height这两个属性的作用,

        就是用来告诉img标签将来需要显示的图片有多宽有多高

      如果img标签没有指定需要显示的图片的宽高,

        那么系统就会按照图片默认的宽高来显示

      如果img标签指定了宽高,那么系统会按照指定的宽高在显示

      5.title:用于告诉浏览器,当鼠标悬停在图片上时

      需要弹出的描述框中显示什么内容。

      6.alt:其实是英文alternate的缩写,它的作用就是用于告诉浏览器

      当需要显示的图片找不到时显示什么内容

  • 相关阅读:
    LVM逻辑卷管理器
    Linux LVM硬盘管理及LVM扩容
    Windows10 笔记本的电池坏了几秒钟就自动关机或休眠
    Cmder 下载地址和配置
    Linux 按 tab 补全忽略大小写
    Layui 官网下线, Layui文档镜像备份
    【markdown】markdown教程(1)
    【Ceph | OSD】删除OSD和Host的正确方法
    OSD
    【Leetocode | 001】146. LRU 缓存机制
  • 原文地址:https://www.cnblogs.com/xiehefeng/p/7756130.html
Copyright © 2011-2022 走看看