要在Web頁面上模擬MsgBox效果,您可以使用JavaScript和CSS來創建一個彈窗。以下是一個簡單的示例代碼:
HTML:
<!DOCTYPE html>
<html>
<head>
<title>MsgBox Simulation</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<button onclick="showMsgBox()">Show MsgBox</button>
<div id="msgBox" class="msgBox">
<div class="msgContent">
<p>This is a message box</p>
<button onclick="closeMsgBox()">Close</button>
</div>
</div>
<script src="script.js"></script>
</body>
</html>
CSS (style.css):
.msgBox {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #f9f9f9;
padding: 20px;
border: 1px solid #ccc;
}
.msgContent {
text-align: center;
}
JavaScript (script.js):
function showMsgBox() {
document.getElementById('msgBox').style.display = 'block';
}
function closeMsgBox() {
document.getElementById('msgBox').style.display = 'none';
}
這段代碼會在頁面上顯示一個按鈕,當用戶點擊按鈕時,會彈出一個模擬的消息框。用戶可以點擊消息框中的“Close”按鈕來關閉消息框。您可以根據需要修改消息框的樣式和內容。