語義UI卡左側有圖像

Question

使用語義UI卡有可能在左側有圖像嗎？該文檔顯示圖像始終位於頂部的示例。我想要得到的東西，如語義UI項目（但我當然希望用卡），像這樣：

我想要得到的是這樣的：

正如您所看到的，圖像位於左側，與Semantic UI卡類似。

Answer 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="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。

爲了使它看起來完全像你的形象，你將需要使你自己的組件/風格。