CSS可以通過選擇器和屬性來控制網(wǎng)頁中的圖片的樣式和布局。通過使用CSS，可以輕松地改變圖片的大小、旋轉(zhuǎn)、縮放、顏色等屬性，使圖片在網(wǎng)頁中更加美觀和易于閱讀。

下面將介紹CSS如何變換圖片的一些基本選擇器和屬性：

1. 使用圖片作為background屬性

使用圖片作為background屬性可以讓網(wǎng)頁的背景圖片自動(dòng)填充整個(gè)網(wǎng)頁。使用圖片作為background屬性時(shí)，需要使用<background>標(biāo)簽來指定圖片的URL。例如：

background: url('圖片地址');

這樣就可以將圖片設(shè)置為網(wǎng)頁的background了。

2. 使用background-size屬性

使用background-size屬性可以控制圖片的大小。background-size屬性可以設(shè)置圖片的大小、寬度和高度，還可以設(shè)置圖片的比例。例如：

background-size: cover;

這個(gè)屬性會(huì)將圖片全部覆蓋網(wǎng)頁的背景，也就是圖片將填滿整個(gè)網(wǎng)頁。如果只想讓圖片一部分覆蓋網(wǎng)頁，可以使用不同的值，例如：

background-size: cover;

background-size: 100% 100%;

這樣就可以讓圖片一部分覆蓋網(wǎng)頁的背景，另一部分保持原有的背景色。

3. 使用background-position屬性

使用background-position屬性可以指定圖片的放置位置。background-position屬性可以設(shè)置圖片的位置、x、y坐標(biāo)和偏移量。例如：

background-position: 50% 50%;

這個(gè)屬性會(huì)將圖片放在網(wǎng)頁內(nèi)容的50%位置，也就是在中間。如果只想讓圖片在網(wǎng)頁的某一部分出現(xiàn)，可以使用不同的值，例如：

background-position: 50% 100%;

background-position: -50% 100%;

這樣就可以讓圖片在網(wǎng)頁的某一部分出現(xiàn)，并且圖片的放置位置在中間。

4. 使用transform屬性

使用transform屬性可以添加一些變換效果。transform屬性可以添加旋轉(zhuǎn)、縮放、平移等效果。例如：

transform: rotate(45deg);

transform: scale(1.1);

這樣就可以將圖片旋轉(zhuǎn)45deg，并且將圖片的放大1.1倍。

通過使用CSS，可以輕松地變換圖片的大小、旋轉(zhuǎn)、縮放、顏色等屬性，使圖片在網(wǎng)頁中更加美觀和易于閱讀。