<Button>不能使用弹出窗口。(HTML、CSS、JS)

Question

我真搞不懂。我创建了一个带有css颜色值的笑脸。但当我加了纽扣的时候，那张脸就难看了。(它在笑脸设计的中心增加了一个圆圈)我试着用弹出窗口的相同元素( popScroll )转发按钮标签。不过，我的运气还没有一帆风顺。

当我单击右下角的submit按钮时，弹出窗口将打开并刷新，这很好。它显示了它的工作，但我真的想要得到这个笑脸，我已经做了这个弹出式弹出，这样我可以更进一步的设计。

有人能告诉我我做错了什么吗？我对此非常陌生，我希望了解一下如何成为一个更好的程序员和开发人员。当你现在点击按钮(笑脸)时，它会发出一个警告，上面写着你好，我只是试着看一个透明的按钮盖在脸上就行了。

我会立即积极回答任何问题和答复。

我的代码可以找到这里。

<div class="popScroll">
    <div class="popup"> 
    <!-- Smiley button -->
    <button onclick="alert('hi');" class="smiley">
        <!--<div class = "smiley"></i></div>-->
    </button>

Answer 1

似乎在css中添加了更高的边框。

移除这个，你就应该被分类了。

.smiley {
    border: none;
}

CodePen

Answer 2

这就是你要找的吗？

.smiley:focus{ outline: none}