Bevezetés
Kezdjük el az mdui használatát a CDN segítségével és egy legegyszerűbb oldalsablonnal.
Az mdui 2 dokumentációját olvassa!
Az mdui 1 dokumentációjának megtekintéséhez látogasson el a www.mdui.org/docs/ oldalra.
Gyors áttekintés
Az mdui legegyszerűbb használati módja, ha a CSS és JS fájlokat közvetlenül CDN-ről importálja.
Ha npm segítségével szeretné telepíteni az mdui-t, tekintse meg a Telepítés fejezetet.
Fájlok importálása
Adja hozzá a következő kódot az oldal <head> címkéjéhez:
<link rel="stylesheet" href="https://unpkg.com/mdui@2/mdui.css" />
<script src="https://unpkg.com/mdui@2/mdui.global.js"></script>
Ha a komponensek ikon attribútumát (például a <mdui-button icon="search"></mdui-button> icon attribútumát) szeretné használni, akkor az ikonok CSS fájlját is importálnia kell (lásd Material Icons ikonok használata).
Az mdui nem függ semmilyen harmadik féltől származó könyvtártól, a fenti fájlok importálása után már működnie kell.
A legegyszerűbb oldalsablon
Az alábbiakban egy legegyszerűbb oldalsablon látható, amelyhez további komponenseket és tartalmakat adhat hozzá egy weboldal felépítéséhez.
<!doctype html>
<html lang="hu">
<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"/>
<link rel="stylesheet" href="https://unpkg.com/mdui@2/mdui.css">
<script src="https://unpkg.com/mdui@2/mdui.global.js"></script>
<!-- Ha a komponensek icon attribútumát használja, akkor az ikonok CSS fájlját is importálnia kell -->
<title>Helló, világ!</title>
</head>
<body>
<mdui-button>Helló, világ!</mdui-button>
</body>
</html>