在CSS中,您可以使用position
屬性將輸入框放置在圖片中,以下是一個(gè)示例:
HTML代碼:
<div class="image-container"> <img src="image.jpg" alt="圖片描述"> <input type="text" class="image-input"> </div>
CSS代碼:
.image-container { position: relative; width: 300px; height: 200px; } .image-input { position: absolute; top: 50px; left: 100px; }
在這個(gè)示例中,image-container
是包含圖片和輸入框的容器。position: relative;
表示該容器相對(duì)于其正常位置進(jìn)行定位。width
和height
屬性設(shè)置了容器的大小。
.image-input
是輸入框的樣式。position: absolute;
表示該輸入框相對(duì)于***近的定位祖先(即image-container
)進(jìn)行定位。top
和left
屬性設(shè)置了輸入框在容器中的位置。
您可以根據(jù)需要調(diào)整top
、left
、width
和height
屬性的值,以改變輸入框在圖片中的位置和大小。