如今網頁設計越來越重視視覺效果，css作為一種樣式語言，也在設計中扮演著非常重要的角色。在設計中，有時需要將圖片與文字結合起來，達到更好的呈現效果。下面我們來講講如何用css實現圖片右，文字左的效果。

HTML代碼：
```html
這是一段示例文本，用于演示圖片右文字左的效果。
```
CSS代碼：
```css
.clearfix::after {
content: "";
display: table;
clear: both;
}
.float-right {
float: right;
margin: 0 0 10px 10px;
}
p {
margin-bottom: 10px;
}
```

首先，我們需要在HTML中使用一個div元素來包裹圖片和文字。然后，我們使用CSS中的float屬性將圖片向右浮動，并給它一個右側的10px的外邊距，使得文字能夠與圖片形成一定距離。使用clearfix類來清除浮動，防止包裹元素塌陷。最后，給p元素一個下方10px的外邊距，使其與下一個元素分隔開來。

通過這樣的設置，我們就可以很容易地實現圖片右，文字左的效果。這也為我們設計網頁帶來了更多的選擇，讓我們的網頁更加美觀、生動。