ionic ialah perpustakaan UI mudah alih yang ringan dengan ciri-ciri kelajuan pantas, antara muka moden dan penampilan yang cantik. Untuk menyelesaikan masalah beberapa perpustakaan UI lain yang berjalan perlahan pada telefon mudah alih, ia secara langsung melepaskan sokongan untuk versi di bawah IOS6 dan Android4.1 untuk mendapatkan pengalaman pengguna yang lebih baik.

butang ionik sintaks

Butang merupakan bahagian penting dalam apl mudah alih Gaya apl yang berbeza memerlukan gaya butang yang berbeza.

butang ionik contoh

<html ng-app="ionicApp">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
        <title>PHP中文网(php.cn)</title>
        <link href="https://cdn.bootcss.com/ionic/1.3.2/css/ionic.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/ionic/1.3.2/js/ionic.bundle.min.js"></script>
    </head>
    <body>
    
    <div class="bar bar-header">
      <div class="h1 title">Buttons</div>
    </div>
    
    <div class="content has-header padding scroll scroll-content" style="overflow-y:auto">

      <p><button class="button button-light">button-light</button>
      </p><p><button class="button button-stable">button-stable</button>
      </p><p><button class="button button-positive">button-positive</button>
      </p><p><button class="button button-calm">button-calm</button>
      </p><p><button class="button button-balanced">button-balanced</button>
      </p><p><button class="button button-energized">button-energized</button>
      </p><p><button class="button button-assertive">button-assertive</button>
      </p><p><button class="button button-royal">button-royal</button>
      </p><p><button class="button button-dark">button-dark</button></p>

    </div>

  </body>
</html>

Run Instance »

Klik butang "Run Instance" untuk melihat instance dalam talian