Javascript 如何加上「；x"；在弹出窗口右上角的关闭按钮？

我试图在弹出窗口的右上角添加一个小的“x”关闭按钮。我怎样才能正确地添加它的php代码和css，也许还有它的javascript

我尝试将以下1、2个代码添加到3个代码块中：

1） 我添加的第一个代码：

<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

×

2） 添加第二个代码：

<div id="my-id">
    <div class="uk-modal-dialog">
        <button class="uk-modal-close-default" type="button" uk-close></button>
    </div>
</div>

<div id="my-id">
    <div class="uk-modal-dialog">
        <button class="uk-modal-close-outside" type="button" uk-close></button>
    </div>
</div>

3） 要查看弹出窗口的此代码块，请执行以下操作：

   <div class="uk-modal-dialog">
    <div class="uk-modal-header">
            <h2><?php echo esc_attr_e( $options['popuptitle'] ); ?></h2>
        </div>
        <div class="uk-modal-content"><?php echo stripslashes( $options['popuptext'] ); ?></div>
        <div class="uk-modal-footer">
            <button id="button1" type="button" class="uk-button uk-button-large uk-button-<?php echo esc_attr_e( $options['popupbutton1style'] ); ?><?php if( $options['popupbuttonoptions'] != 'button-1-redirect' ) echo ' uk-modal-close'; ?>"><?php echo esc_attr_e( $options['popupbutton1text'] ); ?></button>
        </div>
    </div>
</div>

看看这是否对你有帮助：


.close按钮{
边界：无；
显示：内联块；
填充：8px 16px；
垂直对齐：中间对齐；
溢出：隐藏；
文字装饰：无；
颜色：继承；
背景色：继承；
文本对齐：居中；
光标：指针；
空白：nowrap
}
托普赖特先生{
位置：绝对位置；
右：0；
排名：0
}

&时代；
我可以将css添加到wordpress的自定义css中吗？我应该将php代码添加到弹出的php代码块中的哪个位置？尝试添加一个更简单的代码来关闭模式：
window.addEventListener（“click”，function（）{document.getElementById（“modal”）.style.display=“none”}）。。。尝试在每个模式框中添加一个名为
modal
的
id
，这样当单击窗口时，它将关闭所有id为
modal
的模式。如果单击“x”不起作用，请确保您将事件指向模式框本身，但它在关闭后仅显示网站内容的上部尝试从uk模式更改为w3模式（我在网站示例中提供），这可能会导致代码出现问题（另外，w3css更为完整，因为它也具有响应能力，并且在构建中有更多的样式），请参见此处的源代码：