Zcela nové mdui 2 založené na Material Design 3 a Web Components bylo vydáno, přejděte na dokumentaci mdui 2.

Úvod

Začněme s mdui prostřednictvím jeho CDN a nejjednodušší šablony stránky.

Rychlý start

Nejjednodušší způsob, jak začít s mdui, je přímo importovat CSS a JS soubory z CDN.

Pokud chcete použít správce balíčků nebo si stáhnout zdrojové soubory, prosím přejděte na stránku ke stažení.

Soubor CSS

Přidejte následující <link> tag do <head> tagu a umístěte jej před všechny ostatní soubory stylů.

<link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css">

Soubor JS

Přidejte následující <script> tag na konec stránky a před </body> tag.

<script src="https://unpkg.com/mdui@1.0.2/dist/js/mdui.min.js"></script>

mdui nezávisí na žádných knihovnách třetích stran, po importu výše uvedených dvou souborů jej lze normálně používat.

Nejjednodušší šablona stránky

Prosím ujistěte se, že vaše stránka dodržuje nejnovější designové a vývojové standardy, tj. používá HTML5 doctype a obsahuje viewport meta tag pro podporu responzivního designu. Vaše stránka by tedy měla vypadat takto:

<!doctype html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no">
    <meta name="renderer" content="webkit">

    <!-- mdui CSS -->
    <link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css">
    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- mdui JavaScript -->
    <script src="https://unpkg.com/mdui@1.0.2/dist/js/mdui.min.js"></script>
  </body>
</html>

To je vše, co je potřeba pro úplnou stránku. Na základě toho můžete přidat více komponent a obsahu k vytvoření svého webu.

Stažení