在網頁開發中，經常需要將文字和圖片放在一行中顯示，這就需要使用CSS來實現。下面是一些示例代碼來演示如何讓圖文在一行中顯示：

/* 圖片在左，文字在右 */
.image-text{
display: flex;
align-items: center;
}
.image-text img{
margin-right: 10px;
width: 100px; /* 圖片寬度 */
height: auto; /* 高度自適應 */
}
.image-text p{
margin: 0;
}
/* 文字在左，圖片在右 */
.text-image{
display: flex;
flex-direction: row-reverse; /* 將flex的方向反過來 */
align-items: center;
}
.text-image img{
margin-left: 10px;
width: 100px;
height: auto;
}
.text-image p{
margin: 0;
}
/* 圖片在上，文字在下 */
.image-under{
text-align: center;
}
.image-under img{
display: block;
margin: 0 auto 10px; /* 使圖片在水平方向居中 */
width: 100px;
height: auto;
}
.image-under p{
margin: 0;
}
/* 文字在上，圖片在下 */
.text-under{
text-align: center;
}
.text-under img{
display: block;
margin: 10px auto 0; /* 使圖片在水平方向居中 */
width: 100px;
height: auto;
}
.text-under p{
margin: 0;
}

上面的代碼示例分別使用了flex布局和text-align布局來實現圖文在一行中顯示的效果。可以根據不同的需求來選擇相應的布局方式，然后根據具體情況適當調整樣式。