如何在语义 UI 中指定链接项的 URL？

Question

当使用 "Link Item" 时，从 <div class="ui divided link items"> 开始，在语义 UI 中（根据手册：http://semantic-ui.com/views/item.html），我应该在哪里指定 URL 页面的我想要的项目 link 到?

我尝试将整个 <div class="item"> 包裹在 <a> 中，但这样做会破坏项目的格式，使内容显示在图片下方。

Answer 1

您可以将您的 div.item 替换为 a.item，如下面的 fiddle 或 HTML 所示：

<div class="ui divided link items">
  <a class="item" href="http://www.google.com" target="_blank">
    <div class="ui tiny image">
      <img src="http://www.semantic-ui.com/images/avatar/large/stevie.jpg">
    </div>
    <div class="content">
      <div class="header">Google</div>
      <div class="description">
        <p></p>
      </div>
    </div>
  </a>
  <a class="item" href="http://www.yahoo.com" target="_blank">
    <div class="ui tiny image">
      <img src="http://www.semantic-ui.com/images/avatar/large/veronika.jpg">
    </div>
    <div class="content">
      <div class="header">Yahoo!</div>
      <div class="description">
        <p></p>
      </div>
    </div>
  </a>
  <a class="item" href="http://duckduckgo.com/" target="_blank">
    <div class="ui tiny image">
      <img src="http://www.semantic-ui.com/images/avatar/large/jenny.jpg">
    </div>
    <div class="content">
      <div class="header">DuckDuckGo</div>
      <div class="description">
        <p></p>
      </div>
    </div>
  </a>
</div>

如何在语义 UI 中指定链接项的 URL？

How to specify the URL of a linked item in Semantic UI?

semantic-ui