Question

我是HTML的初学者我已经完成了一项任务，在点击图片后在图片下方添加文字

我正在尝试这个

<a href="hh.jpg">
<img src="hh.jpg" width="100" figcaption="has">
</a>

但我的任务需要2页才能完成。我必须在一页中完成。为了完成我的任务。任何人都可以指导我怎么做......？

Answer 1

以下是根据您的要求使用HTML执行此操作的方法。 a的href应该以锚点为目标，然后添加CSS样式以仅在选择target伪类时显示目标位置。

<style>
    #display { display: none; }
    #display:target { display: block; }
</style>
<a href="#display">
    <img src="hh.jpg" width="100" figcaption="has" />
</a>
<div id="#display">Show this text</div>

Answer 2

以下是没有JavaScript的方法，但是使用CSS。

input {
    display: none;
}
span#content {
    display: none;
}
input#show:checked ~ span#content {
    display: block;
}

<label for="show">
    <span>
        <img src="https://i.imgur.com/g3D5jNz.jpg" width="100" figcaption="A cat yesterday"/>
    </span>
</label>
<input type=radio id="show" name="group">
<span id="content">This is a caption</span>

注意：代码改编自this previous answer。

Answer 3

如果您了解javascript，这可以帮助您;如果没有，那么你至少要学习基础知识，如果你想做你想做的事情。在onclick='addtext();'标记内，插入以下javascript代码：

<span id='displaytext'></span>

然后在img标记内添加此事件：<html> <head> <script> function addtext(){ document.getElementById('displaytext').innerHTML='THis is a text'; } </script> </head> <body> <img src="hh.jpg" width="100" figcaption="has" onclick='addtext();> <br> <span id='displaytext'></span> </body> </html> 然后删除你的锚标签在img标记后添加此标记：with pg1 as( SELECT count(),id FROM EventHub where id='1' group by id,TumblingWindow(hour,1) ), pg2 as( SELECT count() ,id FROM EventHub where id='2' group by id, TumblingWindow(hour,1) ), UnionStep as ( Select count() as cnt from pg1 group by TumblingWindow(hour,1) Union All Select count() as cnt from pg2 group by TumblingWindow(hour,1) ) Select * Into PowerBiAlias From UnionStep

您的代码应如下所示：

EPPlus

点击图片后在图片下方添加文字

3 个答案: