HTML | HP制作備忘録

ホームぺージ制作用メモ

 

HTML | CSS | JavaScript | Perl | PHP |
HTML
0.基本 1.テキスト 2.コンテンツ 3.テーブル 4.フォーム 5.ほか 参考:色の一覧

HTML | HP制作コード備忘録

0.基本

   -はじまり

   -ヘッダ部分A

   -ヘッダ部分B

   -ヘッダ部分C

   -レイアウト

   -BODY
 


0.基本

1.テキスト

2.コンテンツ

3.テーブル

4.フォーム

5.ほか



- HTML

- CSS

- JavaScript

- Perl

- PHP










0.基本

0-1 はじまり

「<!DOCTYPE html>」 ・・・HTML5の宣言
「<html>」 ・・・HTML文書はじまり・おわり
「lang="ja"」 ・・・日本語指定


<!DOCTYPE html>
<html lang="ja">
<head>
ヘッダ部分
</head>
<body>
ボディ部分
</body>
</html>
		

0-2 ヘッダ部分A

重要部分
「content-language」=文書の言語(「ja」日本語)


<title>タイトル</title>
<meta name="keywords" content="キーワード1,キーワード2,キーワード3">
<meta name="description" content="サイトの概要">
<meta http-equiv="content-language" content="ja">

		

0-3 ヘッダ部分B

外部


<link rel="stylesheet" href="外部にCSSファイルを用意したパス">
<script src="外部にjsファイルを用意したパス"></script>

		

0-4 ヘッダ部分C

ほか

「charset」=文字指定(「utf-8」「shift_jis」「euc-jp」など)
「noindex,nofollow」=検索されないようにする
「refresh・content」=時間経過で(移動先記入)ページ移動、(移動先なし)毎回再読み込み
「style」=CSS記入


<base href="基準URL">
<meta charset="UTF-8">
<meta name="robots" content="noindex,nofollow"> 
<meta name="author" content="作成者"> 
<meta http-equiv="refresh" content="秒数; url=移動先のURL">
<meta http-equiv="refresh" content="秒数"> 
<script>JavaScriptなどのスクリプト</script>

<style type="text/css">
<!--
abc {def:ghi;}
-->
</style>

<noscript>
JavaScriptが無効な場合の処理
</noscript>

#ここからSNS向け (画像の大きさ)「summary」「summary_large_image」
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ユーザー名" />
<meta property="og:url" content="URL" />
<meta property="og:title" content="タイトル" />
<meta property="og:description" content="内容" />
<meta property="og:image" content="画像URL" />


		

0-5 レイアウト




<h1>大見出し</h1>
<h2>見出し</h2>
<h3>見出し</h3>
<h4>見出し</h4>
<h5>見出し</h5>
<h6>低見出し</h6> 

<p>
ひと段落
align="left"で左寄り
align="right"で右寄り
align="center"で中央揃え
align="justy"で両端揃え 
</p>

<br>改行

<PRE>
整形済みテキスト
</PRE>

<hr> 水平線

<header>
先頭部分
</header>

<footer>
下部分
</footer>

<nav>
主要なリンク欄
</nav>

<article>
ひとまとまりのセクション
</article>

<address>
連絡情報
</address>

<DIV>
ブロック単位
</DIV>

<span>
ひと範囲
</span>


<blockquote cite="引用先URL">
引用文章
</blockquote>

		

0-6 BODY




<body 
bgcolor="背景色" 
text="文字の色" 
link="見ていないページのリンク色" 
vlink="見たページのリンク色" 
alink="クリックしたときのリンク色 
background="背景画像のURL"
>

		



レポリン!|定番サイト情報