是一个示例的HTML代码，可以用于创建一个黑客帝国风格的弹窗，并且包含关闭按钮：
<!DOCTYPE html>
<html>
<head>
<style>
/* 黑客帝国风格的弹窗样式 */
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.9);
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
}
.popup {
padding: 20px;
background-color: #000;
color: #fff;
border: 2px solid #fff;
border-radius: 5px;
}
.close-btn {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
color: #fff;
}
</style>
</head>
<body>
<!-- 弹窗内容 -->
<div class="overlay">
<div class="popup">
<span class="close-btn">×</span>
<h2>黑客帝国风格的弹窗</h2>
<p>这是一个黑客帝国风格的弹窗样式。</p>
</div>
</div>
<script>
// 获取关闭按钮元素
var closeBtn = document.querySelector('.close-btn');
// 获取弹窗元素
var overlay = document.querySelector('.overlay');
// 绑定点击事件，点击关闭按钮时隐藏弹窗
closeBtn.addEventListener('click', function() {
overlay.style.display = 'none';
});
</script>
</body>
</html>
你可以将上述代码保存为HTML文件，然后在浏览器中打开，即可看到黑客帝国风格的弹窗。点击关闭按钮可以成功关闭弹窗。
标签：overlay,color,创建,HTML,黑客帝国,关闭,按钮,黑客,弹窗 From： https://blog.csdn.net/2402_84765445/article/details/139899506