HTML言語って?
HTML言語の役割は、「画面の表示」部分になります。
画面の表示とは、つまり、アプリのデザインになるわけです。HTML言語を学べば、学ぶほど、アプリの画面がカッコ良くなっていきます。
今回のサンプル画面からまずは、HTML言語の構造を理解しましょう!
下記のソースコード(プログラミングで書かれているもの)に説明文を入れていきます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<!DOCTYPE HTML> //HTML言語ですよと説明してるだけ。いつも入れておく。 <html> //ここからHTML言語のスタート。 <head> //下記からのhead(ヘッド)タグの中身で、HTMLの設定をしますが、最初はわからなくて大丈夫です! <meta charset="utf-8"> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: content: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="components/loader.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="css/style.css"> <script> // PhoneGap event handler document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { console.log("PhoneGap is ready"); } </script> </head> //ここでheadタグが終了 <body> //ここからbody(ボディー)タグがスタート。デザイン本体部分ですので、ここを改造していきます! <h1>HelloWorld!</h1> <a class="button--large" href="phonegap-demo.html">Start Demo</a> </body> //ここでbodyタグが終了 </html> //ここでhtmlタグが終了 |
HTML言語の基本は「HTMLタグ」と呼ばれる<>で囲まれた文字です。
HTMLはタグでくくって、使っていきます。
例:
<strong>ここが太文字になる</strong>
HTMLの基本のかたち
<!DOCTYPE HTML>
<html>
<head>
画面の表示サイズなどの設定を書く。
</head>
<body>
本体部分
</body>
</html>