我是Bootstrap Vue的新手,嘗試使用b-card header將圖像對齊到右側。我試著使用<span>或<div>。模板的標題大小很完美,直到我添加了圖像,圖像也在右側顯示一點,但是在下面也有一點。這是我的codepen連結。如果你能提供任何幫助,將不勝感激。
https://codepen.io/tone373/pen/JjeYazG
<b-card header-tag="header"> <template #header> <h4>b-img</h4> <b-img right src="https://picsum.photos/125/125/?image=58" alt="Right image"></b-img> </template> </b-card>
您可以使用Bootstrap的
grid
系統:b-row
使用align-h="between"
可以水平對齊元素,並在它們之間留有空間。<h4>
和圖片被放置在第1列和第2列中,b-col
中的cols="auto"
會自動調整寬度。