cafemocha

cafemocha

ホームページ制作 Webデザイン ブログデザイン Web構築 Android linux PHP パソコン情報 ブログ 掲示板

WEBページの基本

DOCTYPE宣言

HTML5でのWebページを作成する為の宣言

タグ

<!DOCTYPE html>


ルート要素

DOCTYPE宣言に続けて、HTML文章の最上位階層を構成

タグ

<html>


</html>


※「日本語」や「英語」といったコンテンツの記述に使用する主要言語をlang属性で明示しておくことが推奨されています。lang属性は音声ツールや翻訳ツールで利用され、コンテンツを正確に判断されます

<html lang="ja">


メタデータの設定

<head>は<html>の1つ目の子要素として記述します。中に<meta charset="UTF-8">や<title>などを記述します。

タグ

<head>

</head>

書き方

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Cafemocha</title>

</head>

 

</html>


コンテンツ

<body>は<html>の2つ目の子要素として記述します。中に画像などデザインとなるタグを記述します。

タグ

<body>

</body>

書き方

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Cafemocha</title>

</head>

<body>

 

</body>

</html>


スタイルシート

1.<style>を利用するとスタイルシートの設定をHTML内に記述することができます。

2.ファイルからスタイルシートを利用するには<link>のhref属性で指定したファイルを読むことができます。

<link rel="stylesheet" href="../css/testtesttest.css" type="text/css" />

3.スタイルシート内からファイルを利用するには<style>で、@import urlで、ファイルを読むことができます。

<style>

@import url(https://cafemocha7.com/css/abcde.css);

タグ

<style>

</style>

書き方

<title>Cafemocha</title>

<style>

h1, h2{

font-size:10px;

}

</style>

</head>

<body>


スクリプト

スクリプトを利用するには<script>のsrc属性で指定したファイルを読むことができます。

タグ

<script>

</script>

書き方1

<script>

var abc = 0;

</script>

書き方2

<script type="text/javascript" src="../js/testtesttest.js"></script>

<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>