美文网首页
图片元素

图片元素

作者: by依白 | 来源:发表于2024-02-19 23:32 被阅读0次

图片元素

img元素

alt 图片说明

map属性(地图)

子元素 area

左上角为原点
circle圆形
取点:长宽(上左),半径
rect矩形
取点:左上角,右下角
poly多边形
取点:所有点

用name配合使用,usemap连接主地图,用法和锚点一致

figure和元素

figcaption标题

例子:

  <figure>
        <figcaption>
  <h1>太阳系</h1>
        </figcaption>

        
        <img usemap="#slMpo" src="./img/solar.jpg" alt="太阳系">
    </figure>
  
    <map name="slMpo">
        <area shape="circle" coords="362,202,50" href="https://baike.baidu.com/item/%E6%9C%A8%E6%98%9F/222105?fr=ge_ala" alt="木星">
        <area shape="rect" coords="762,192,846,231" href="https://baike.baidu.com/item/%E8%A1%8C%E6%98%9F/15991" alt="">
        <area shape="poly" coords="260,370,288,325321,347,292,326" href="https://baike.baidu.com/item/%E6%9C%88%E7%90%83/30767?fromtitle=%E6%9C%88%E4%BA%AE&fromid=5557" alt="">
    </map>

掌握以上常用的就行

相关文章

  • 图片元素

    图片元素 source元素:空元素;使用方式是将src放入其中 img image缩写,空元素 src(sourc...

  • HTML5图像映射

    为图片建立超链接(img元素) 由于img元素是行内级元素,所以可以使用a元素为图片定义超链接。当用户单机图片是就...

  • 图片与父级元素下边框留空隙的解决办法

    问题描述 在网页中插入图片,图片不受父元素的限制,总共分为两种情况: 如果父元素是块级元素,插入的图片会把父元素的...

  • 第七节:图片

    图片元素 img元素 image缩写,空元素src属性:sourcealt属性:当图片资源失效时,将使用该属性的文...

  • 元素 鼠标上的操作

    1、鼠标点击图片元素时,替换图片,元素上增加 onmousedown="this.src='../../../st...

  • canvas多个元素的动画

    多个图片元素的动画绘制 步骤: 每一帧动画的元素都重新绘制在画板中; 将元素创建的对象放入数组中,遍历元素,图片加...

  • 点击图片弹出大图

    点击图片弹出大图demo源码 大体步骤: 获取图片元素,监听点击事件 点击后获取到点击图片的 src 生成 元素,...

  • 行内元素居中对齐 (图片与文字混排)

    行内元素或行内块元素,文字要图片垂直居中对齐,line-height的高度与图片等高。

  • 13 HTML:嵌入内容

    网页中嵌入其他类型的资源,比如图片、音频、视频等媒体元素。 1.图片元素的使用 img元素表示图像,属性:-src...

  • 前端常见问题及解决方式

    CSS中常见案例 1、图片间隙div中的图片间隙bug:在块元素中插入图片时,有时图片会将块元素下方撑大三像素。h...

网友评论

      本文标题:图片元素

      本文链接:https://www.haomeiwen.com/subject/vixbadtx.html