我在我的CSS类中使用了::before和::after元素在我的按钮中放置了一个底部边框，但这在我的情况下似乎不起作用。
我已将::before元素标记定位为absolute，以便边框位于按钮内，但由于某些原因，边框一直延伸到整个页面而不仅仅是按钮。
.mydiv {
background-color: #242128;
border-radius: 0;
height: 1000px;
width: 100%;
}
body {
margin: 0px;
}
.mybtn2 {
border: none;
font-size: 2em;
border-radius: 5px;
cursor: pointer;
color: white;
font-family: Serif;
margin-top: 50px;
margin-left: 5%;
background-color: #242128;
padding: 5px 10px;
}
.mybtn2::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-bottom: 2px solid white;
}<body>
<div class="mydiv">
<button class="mybtn2">Hover Me</button>
</div>
</body>你需要position: relative;上的.mybtn2。