CSS中的alert是指在網頁中彈出提示框的效果。alert通過CSS的樣式來控制彈出框的外觀和行為。下面我們來介紹一下CSS中使用alert的方法。

/* 定義alert的樣式 */ 
.alert {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
height: 200px;
background-color: #fff;
z-index: 10;
border-radius: 10px;
box-shadow: 0px 0px 10px #666;
 }
/* 定義alert中的文本樣式 */
 .alert p {
font-size: 18px;
font-weight: bold;
text-align: center;
margin-top: 50px;
 }
/* 定義alert中的按鈕樣式 */
 .alert button {
display: block;
margin: 20px auto;
padding: 5px 10px;
border-radius: 5px;
border: none;
background-color: #007bff;
color: #fff;
 }

以上代碼定義了一個alert的外觀和樣式，包括彈出框的位置和形狀，彈出框中文字的樣式以及按鈕的樣式。

//點擊按鈕觸發alert的彈出
 document.querySelector('button').addEventListener('click', function() {
var alertBox = document.createElement('div');
alertBox.classList.add("alert");
alertBox.innerHTML = '
這是一個提示框
關閉';
document.body.appendChild(alertBox);
 });
//點擊按鈕關閉alert
 document.querySelector('body').addEventListener('click', function(e) {
if (e.target.classList == "alert" || e.target.innerText == "關閉") {
document.querySelector('.alert').remove();
}
 });

以上代碼實現了點擊按鈕彈出alert的效果，并且可以通過點擊按鈕或彈出框外部關閉alert。

總的來說，CSS中的alert可以通過樣式的定義和JavaScript的控制來實現一個美觀、實用的彈出框。在實際開發中，我們可以根據需求進行相應的修改和定制，讓alert更符合我們的需求。