本文目錄導讀：

1. 使用不同的類名
2. 使用內(nèi)聯(lián)樣式
3. 使用偽類選擇器

兩個按鈕的CSS設置

在CSS中，我們可以使用不同的樣式來定制兩個按鈕的外觀，這包括顏色、大小、形狀等屬性，以下是一些示例，展示如何為兩個按鈕分別設置樣式：

使用不同的類名

我們可以為兩個按鈕分別設置不同的類名，然后在CSS中為每個類名定義不同的樣式。

HTML代碼：

<button class="button1">按鈕1</button>
<button class="button2">按鈕2</button>

CSS代碼：

.button1 {
  background-color: blue;
  color: white;
}
.button2 {
  background-color: red;
  color: white;
}

使用內(nèi)聯(lián)樣式

我們也可以在HTML標簽中使用內(nèi)聯(lián)樣式來直接設置按鈕的樣式。

HTML代碼：

<button style="background-color: blue; color: white;">按鈕1</button>
<button style="background-color: red; color: white;">按鈕2</button>

CSS代碼：

無需要設置，因為樣式已經(jīng)在HTML標簽中定義。

使用偽類選擇器

我們可以使用偽類選擇器來區(qū)分兩個按鈕的狀態(tài)，

HTML代碼：

<button class="button">按鈕1</button>
<button class="button">按鈕2</button>

CSS代碼：

.button:first-child {
  background-color: blue;
  color: white;
}
.button:last-child {
  background-color: red;
  color: white;
}

在這個示例中，我們使用偽類選擇器來區(qū)分兩個按鈕的位置，并為它們分別設置樣式，希望這些示例能幫助你更好地理解和應用CSS來定制兩個按鈕的外觀。