Semantic UI一套类似bootstrap更加语义化前端框架

Semantic empowers designers and developers by creating a language for sharing UI.

Semantic is tag ambivalent meaning you can use any html tags with UI elements
语义话的标记意味着你可以在任何html标签中使用这些UI元素!

Semantic UI

<main class="ui three column grid">
  <aside class="column">1</aside>
  <section class="column">2</section>
  <section class="column">3</section>
</main>


Bootstrap

<div class="row">
  <div class="col-lg-4">1</div>
  <div class="col-lg-4">2</div>
  <div class="col-lg-4">3</div>
</div>


Semantic UI

<nav class="ui menu">
  <h3 class="header item">Title</h3>
  <a class="active item">Home</a>
  <a class="item">Link</a>
  <a class="item">Link</a>
  <span class="right floated text item">
    Signed in as <a href="#">user</a>
  </span>
</nav>

Bootstrap

<div class="navbar">
  <a class="navbar-brand" href="#">Title</a>
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">User</a></p>
  </ul>
</div>


Semantic UI一套类似bootstrap更加语义化前端框架

网站地址:http://semantic-ui.com/

捐助共勉
版权声明:若无特殊注明,本文皆为原创,转载请保留文章出处。