<div>是HTML中的一個標簽，用于創建一個包含塊級元素的容器。通過使用<div>標簽，我們可以將一組元素包裹在一個容器中，從而可以更方便地控制和布局這些元素。而"div 右邊 圖片"指的就是在一個<div>容器中，將圖片放在容器的右側。
下面將通過幾個代碼案例來詳細解釋說明如何實現<div>右邊圖片的布局。
第一個例子是將圖片完全放在<div>容器的右側，代碼如下所示：

<div style="display: flex;">
<div style="flex: 1;">
<p>這是容器的左側內容</p>
</div>
<img src="圖片地址" style="width: 200px; height: 200px;">
</div>

在這個例子中，我們使用了CSS的flex布局，通過設置容器的display屬性為flex，可以使容器的子元素以彈性盒模型的方式進行排列。子元素的flex屬性確定了它們在容器中所占的比例，這里設置左側容器的flex屬性為1，表示該容器會占據容器的剩余空間，而圖片則會根據其實際大小進行顯示。
第二個例子是將圖片放在<div>容器的右上角，代碼如下所示：

<div style="position: relative;">
<p>這是容器的內容</p>
<img src="圖片地址" style="position: absolute; top: 0; right: 0; width: 200px; height: 200px;">
</div>

在這個例子中，我們使用了CSS的position屬性來實現圖片的定位。通過設置容器的position屬性為relative，可以將其作為相對定位的參考點。而圖片的position屬性設置為absolute，表示其位置相對于最近的已定位祖先元素進行定位。通過設置top和right屬性為0，可以將圖片放在容器的右上角。
第三個例子是將圖片放在<div>容器的右邊，并保持圖片的原始比例，代碼如下所示：

<div style="float: right;">
<p>這是容器的內容</p>
<img src="圖片地址" style="max-width: 100%; height: auto;">
</div>

在這個例子中，我們使用了CSS的float屬性來實現圖片的右浮動。通過設置容器的float屬性為right，可以將其右浮動。在圖片的樣式中，設置max-width屬性為100%，表示圖片的寬度不超過容器的寬度，而height屬性設置為auto，表示高度根據圖片的比例自動調整。
通過以上代碼案例的演示，我們可以看到如何在<div>容器中實現圖片在右邊的布局。通過使用CSS的靈活布局和定位屬性，我們可以輕松地控制和布局<div>容器內的元素，滿足不同的需求。