在CSS中，我們可以使用規則定義對話框的樣式。一般來說，對話框可以分為以下幾種類型：

/* 基本對話框 */
.dialog {
width: 400px;
height: 300px;
background-color: #fff;
border: 1px solid #ccc;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* 模態對話框 */
.modal-dialog {
/* 基本對話框樣式 */
/* ... */
z-index: 999; /* 讓對話框顯示在最上層 */
}
/* 提示框 */
.tooltip {
display: inline-block;
position: relative;
}
.tooltip .tooltiptext {
visibility: hidden;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
background-color: #000;
color: #fff;
padding: 5px;
border-radius: 5px;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
/* 標題欄 */
.dialog-header {
height: 30px;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
}
/* 內容區域 */
.dialog-body {
height: calc(100% - 30px);
overflow: auto;
padding: 10px;
}
/* 底部按鈕 */
.dialog-footer {
height: 40px;
background-color: #f2f2f2;
border-top: 1px solid #ccc;
text-align: right;
padding-right: 10px;
}

通過以上常見對話框類型的CSS規則定義，我們可以更加方便地定義對話框的樣式。當然，具體的樣式還要根據實際需求進行調整。