使用CSS設置圖片居于右側可以讓文本與圖片更好地搭配，使頁面布局更加美觀。下面是一些實現右側圖片的CSS代碼。 1. 使用浮動 可以使用float屬性將圖片浮動到文本的右側。例如： pre { .img-right { float: right; margin: 0 0 10px 10px; } } 注意：浮動元素可能會影響頁面布局，因此需要給容器設置clear屬性，以避免元素溢出容器。 2. 使用flexbox Flexbox是CSS3的一種布局模式，可以簡化網頁頁面的布局。我們可以使用flexbox來實現圖片居右側。 pre { .container { display: flex; flex-direction: row-reverse; align-items: center; } .container img { margin-left: 10px; } } 這個示例中，我們使用了flex-direction屬性來反轉容器中的元素方向，也就是將圖片置于文本的右側。此外，使用align-items屬性來使文本和圖片垂直居中。 3. 使用定位 可以使用position屬性和right屬性來將圖片置于文本的右側。 pre { .img-right { position: absolute; top: 0; right: 0; margin: 10px; } } 此處，我們使用absolute屬性將圖片定位在文本右側，使用top、right屬性來將圖片貼在文本右側，使用margin屬性來調整圖片的位置。 需要注意的是，使用定位時需要考慮元素和父元素的定位關系，以免影響到原本的頁面布局。 總的來說，以上三種方法都可以實現圖片居于右側。具體要根據實際情況來選擇合適的方法。