Semantic UI Cardを使うことは可能ですか?左側の画像?ドキュメントは、イメージが常に一番上にある例を示しています。私が入手したいのはSemantic UI Itemのようなものです(もちろんカードを使いたいのですが)。
私が入手したいのはこのようなものです。
ご覧のとおり、画像は左側にあり、それはSemantic UIカードに似たものです。
回答:
回答№1は1セマンティックコンポーネントを使ってできることは、次のようになります。
<div class="ui card" style="max-width: 100%; min-width: 100%;">
<div class="content" style="padding: 0;">
<div class="ui items">
<div class="item">
<div class="ui medium image">
<img src="/images/https://semantic-ui.com/images/wireframe/image.png">
</div>
<div class="content" style="padding: 1rem;">
<a class="header">12 Years a Slave</a>
<div class="meta">
<span class="cinema">Union Square 14</span>
</div>
<div class="description">
<p></p>
</div>
<div class="extra">
<div class="ui label">IMAX</div>
<div class="ui label"><i class="globe icon"></i> Additional Languages</div>
</div>
</div>
</div>
</div>
</div>
<div class="extra content">
<a>
More Info
</a>
</div>
</div>
私は padding
コンテンツには含まれていますが、それが唯一のカスタムCSSです。
あなたのイメージと全く同じに見えるようにするには、あなた自身のコンポーネント/スタイルをあなた自身のものにする必要があります。