CSS規則可以用于定義對話框中的選項卡。

要創建選項卡，需要首先創建一個包含所有選項卡的容器，每個選項卡的內容則需要放在對應的標簽中。

/* 定義選項卡容器樣式 */
.tab-container {
/* 添加邊框 */
border: 1px solid #ccc;
/* 定義寬度 */
width: 500px;
}
/* 定義選項卡按鈕樣式 */
.tab-btn {
/* 添加背景色 */
background-color: #f0f0f0;
/* 設置內邊距 */
padding: 10px;
/* 設置字體大小和顏色 */
font-size: 14px;
color: #333;
/* 添加邊框 */
border: 1px solid #ccc;
/* 浮動到左側 */
float: left;
/* 設置指針樣式 */
cursor: pointer;
}
/* 定義選項卡內容樣式 */
.tab-content {
/* 設置內邊距 */
padding: 10px;
/* 添加邊框 */
border: 1px solid #ccc;
/* 清除浮動 */
clear: both;
}
/* 設置選中狀態 */
.tab-btn.active {
/* 添加背景色 */
background-color: #fff;
/* 刪除下邊框 */
border-bottom: none;
/* 定義邊框 */
border-right: 1px solid #ccc;
border-left: 1px solid #ccc;
}
/* 設置選項卡之間的間距 */
.tab-btn + .tab-btn {
margin-left: -1px;
}

在HTML中需要按照以下方式編寫代碼：

<div class="tab-container">
<button class="tab-btn active">選項卡1</button>
<button class="tab-btn">選項卡2</button>
<button class="tab-btn">選項卡3</button>
<div class="tab-content">選項卡1的內容</div>
<div class="tab-content">選項卡2的內容</div>
<div class="tab-content">選項卡3的內容</div>
</div>

上面的代碼中，我們定義了一個class名為'tab-container'的div，其中包含了三個class名為'tab-btn'的按鈕和三個class名為'tab-content'的內容塊。

class名為'tab-btn'的按鈕在被點擊后應該添加一個class名為'active'的類，remove掉之前的'active'類，同時顯示對應的內容塊，其他內容塊被隱藏。

通過CSS和jQuery可以輕松實現基礎的選項卡功能，從而讓用戶更加方便地瀏覽和使用你的網站。