Use js to add text to pictures of different sizes

add the words "I am the text" in the a tag to the lower right corner of the picture. The id of each picture is "img". The size of each picture is different, and it is required to be fixed in the lower right corner of each picture. In fact, it is the role of watermark. It requires that you use js and css, instead of canvas. Ask the old driver for advice!

<a id="text"></a>

<img id="img" src="https://img.codeshelper.com/upload/img/2021/04/05/ov1dpvvcyy115373.png" width="100px" height="100px"></img>
<img id="img" src="https://img.codeshelper.com/upload/img/2021/04/05/ov1dpvvcyy115373.png" width="200px" height="300px"></img>
<img id="img" src="https://img.codeshelper.com/upload/img/2021/04/05/ov1dpvvcyy115373.png" width="400px" height="250px"></img>
<img id="img" src="https://img.codeshelper.com/upload/img/2021/04/05/ov1dpvvcyy115373.png" width="700px" height="810px"></img>
Apr.05,2021


< html >
< head >

<title></title>
<style type="text/css">
     .common{
     position: relative;
         overflow: hidden;
     }
     .img{
         
         width: 400px;
     }
    .img::after{
        content: '';
        position: absolute;
        bottom: 10px;
        right: 10px;
        width: 60px;
        height: 22px;
        line-height: 22px;
        background: -sharpfff;
        color: -sharp000;
        font-size: 15px;
        display: block;
        z-index: 45555
    }
</style>

< / head >
< body >

< div class= "img common" >
https://gd1.alicdn.com/imgext.; width= "400px" height= "300px" / >

< / div >

< / body >
< / html >

the outer div you want to control follows the width of your picture. This is just a realizable idea, depending on your own needs


<div style='position:relative'>
    <a style='position:absolute;right:0;bottom:0;'></a>
    <img>
</div>
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b2bb88-2b235.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b2bb88-2b235.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?