Question

我想在邮件的右上角添加一个“X”按钮，以便人们可以关闭它。你们有人可以帮助我吗？我在JavaScript中并不是那么好

这是HTML：

<div class="warning">This is just a test.</div>

这是CSS：

.warning {
    border: 1px solid;
    margin: 10px 0px;
    padding:15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('images/icons/warning.gif');
}

Answer 1

您可以使用absolute定位来设置近距离图像。

您只需要使用父div容器包装标记

<div class="parent">
<div class="warning">This is just a test.</div>
    <img class="close" src="http://findicons.com/files/icons/1715/gion/24/dialog_cancel.png" />
</div>

然后像这样添加css

.parent
{
  position:relative;
}
.close
{
    position:absolute;
    top:-15px;
    right:-15px;
    height:20px;
    width:20px;
}

JS Fiddle

隐藏这个。你只需要添加一些javascript代码。

警告消息弹出窗口，其中包含一个关闭它的按钮

1 个答案: