Zilap Magic Color Font 表示デモ


<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Zilap Magic Color Font 表示デモ</title>

<style>
    @font-face {
        font-family: 'Zilap Magic';
        src: url('http://urbanqee.com/xxxxx/font/color/ZilapMagic-vmnRM.ttf');
    } 
    .gilbert {
        font-family: 'Zilap Magic';
        font-size: 4.5rem;
    }
</style>

</head>
<body>
<h1>Zilap Magic Font 表示デモ</h1>
<form>
表示文字入力（英字）：<input type="text" name="intext" value="Zilap Magic" id="intext" size=30>
<input type="button" value="表示" onclick="chainge(this.form)">
</form>
   <p class="gilbert" id="str">Zilap Magic</p>

<!-- 入力フォーム処理 -->
<script>
function chainge(obj){
v = obj.intext.value;
var elem = document.getElementById("str");
elem.innerText = v;
}
</script>
</body>
</html>