验证后如何使用 JavaScript 和 HTML5 将图像放在单选按钮上

Posted 2023-03-27

【中文标题】验证后如何使用 JavaScript 和 HTML5 将图像放在单选按钮上

【英文标题】：How to put an image on a radio button with JavaScript and HTML5 after being validated

【发布时间】：2016-12-23 01:45:07

【问题描述】：

验证问题后，我需要将叠加图像放置到单选按钮上。如果答案是正确的，则单选按钮上方会出现一个勾号，如果出现错误，则错误答案中会出现叉号，右侧会出现勾号。 所有这些都使用 JS 和 html。

代码已经可以了，我只需要放图片。

有什么想法吗？谢谢！

【问题讨论】：

请附上您的代码

您可以在 CSS 中对单选按钮和 Z-index 使用相对定位，以使两个叠加图像都恰好位于单选按钮的顶部，然后有选择地从其样式中删除 hidden 属性.

【参考方案1】：

您需要使用 z-index (css)，并隐藏。你的代码是什么？

 img 
 position: absolute;
 left: 0px;
 top: 0px;
 z-index: -1; 
 

<img src="http://www.ultracurioso.com.br/wp-content/uploads/2015/09/2110.jpg" >

<p>the image has a z-index of -1, your button/html code has overlay</p>

</body>
</html>