采用純CSS實現一些著名公司的Logo

jopen 11年前發布 | 18K 次閱讀 CSS 前端技術

Logos In Pure CSS

采用純CSS（less）來創建一些著名公司的Logo。

使用這些圖標的最簡單的方法是導入相應的 .less file在你自己的.less樣式表。

@import "relative/path/to/logos-in-pure-css/推ter.less";

You can also link the stylesheet via .html (but you'll need a copy of less.js, tested on > v1.3.3):

<link type="text/less" rel="stylesheet" href="/path/to/logos-in-pure-css/推ter.less"> 
<script type="text/javascript" src="/path/to/less.js"></script>
If you prefer not to use less, you can use the .css file provided:
<link type="text/css" rel="stylesheet" href="/path/to/logos-in-pure-css/推ter.css">

Once imported, copy the accompanying logo .html into your own .html file and the icon should display!

<div class="logo-推ter-{{ size }}">                                      
  <div class="body"></div>
  <div class="body-none"></div>
  <div class="beak-bottom"></div>
  <div class="beak-bottom-none"></div>
  <div class="wing-bottom"></div>
  <div class="wing-bottom-none"></div>
  <div class="wing-middle"></div>
  <div class="wing-middle-none"></div>
  <div class="wing-top"></div>
  <div class="wing-top-none"></div>
  <div class="beak-top"></div>
  <div class="beak-top-none"></div>
  <div class="head"></div>
</div>

項目主頁：http://www.baiduhome.net/lib/view/home/1370093539336

 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！