Bootstrap Vue を使用して画像を右揃えにする方法

Question

私は Bootstrap Vue を初めて使用するので、b カード ヘッダーを使用して画像を右に揃えようとしています。 または

を使用してみました。テンプレートのタイトル サイズは、画像を追加するまでは完璧でしたが、画像は少し右に表示されましたが、少し下にも表示されました。これが私のコードペンリンクです。ご協力いただければ幸いです。

https://codepen.io/tone373/pen/JjeYazG

リーリー

P粉216807924407日前576

Answer 1

Bootstrap の grid システムを使用できます:

リーリー

b-rowalign-h="between" を使用して要素を水平方向に整列させ、要素間にスペースを残します。 <h4> と画像が列 1 と 2 に配置されます。b-col の cols="auto" によって幅が自動的に調整されます。