图片元素

2024-02-19  本文已影响0人  by依白

图片元素

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>

掌握以上常用的就行

上一篇 下一篇

猜你喜欢

热点阅读