プログラミング html

#1

HTML : Webページを作るための言語
web ページで右クリックをするとページのソースを表示という項目が出る
それを選択するとコードを見ることができる。
<h1></h1> headingの1番目 一番大事な見出しにつける

CSS: Webページの見た目をよくする

 

#3

<h1-6></h1-6> heading 見出しは重要度に応じて1~6まで指定できる
<p> paragraph 通常の段落

<h1>   犬が好き  </h1>
開始タグ  コンテンツ 終了タグ
要素 :開始タグ、コンテンツ、終了タグの1纏まり
マークアップ:コンテンツをタグで囲って要素を作ること

HTML= HyperText Markup Language

#5

<!DOCTYPE html>文書の種類がhtmlだよという意味

<html lang="ja"> language Japanese

<head> 文書の情報

</head>

<body> 文書の本文

</body>

</html>

 

#9

<h#>  :見出し

<p>  :段落

 

#10

 <hr> 水平の罫線 horizontal rule
<br> 改行 break
<strong></strong> 協調 太字になる
<blockquote></blockquote> 引用 字下げされて少し目立つ

 

#14

<a href="ファイル名"></a> 別ファイルへのリンクができる

 

#15

<ul></ul> unordered list 順序がない箇条書きのリストを表示する
<ol></ol> ordered list 順序があるリストを番号付きで表示する
<li></li> list item リストの項目を表示するために使用するタグ
<a href="url" target="_blank"></a> 外部サイトに飛ぶ
target="_blank 別のタブで開きたいときに使う
<a href="~@~.com" target="_blank"></a>
mailto:email address ここに入れたアドレスをあて先に入れた状態のメール作成画面が開く

 

#18

表の表現
1.全体を<table>タグで囲う
2.見出し部分は<thead>で囲う table header
3.本体部分は<tbody>で囲う table body
4.それぞれの行は<tr>で囲う table row
5.見出し部分のセル<th> table header cell
6.本体のセル<td> table data cell

 

#19

<table>
 <thead>
  <tr><th>A</th><th>B</th></tr>
 </thead>
 <tbody>
  <tr><td>C</td><td>D</td></tr>
  <tr><td>E</td><td>F</td></tr>
 </tbody>
</table>

 

#20

<form></form> :入力・送信フォームを作成する際に使用
<label></label> : フォーム部品と項目名(ラベル)を関連付ける
<input> :テキスト入力欄や実行ボタン等、 フォーム(<FORM>~</FORM>)を構成する部品を作成するタグ。
参考:http://www.htmq.com/
<INPUT>タグはテキスト入力欄や実行ボタン等、 フォーム(<FORM>~</FORM>)を構成する部品を作成するタグです。 type属性の値により、一行テキストボックス・チェックボックスラジオボタン・実行ボタン・リセットボタン等の部品となります。

type="text"
1行テキストボックスをつくります。通常のテキストを入力するフィールドです。2行以上にわたる長い文章を入力させたい場合には、<TEXTAREA>~</TEXTAREA>を使用します。
type="password"
パスワード入力ボックスをつくります。入力したテキストがアスタリスク(*)などに置き換えて表示されます。ただし、データが暗号化されるわけではないので、送信されたデータを受け取ることができれば内容を見ることができます。利用の際には注意してください。
type="checkbox"
チェックボックスをつくります。チェックボックスは複数選択が可能です。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります。
type="radio"
ラジオボタンをつくります。複数の中から一つしか選択できない点がチェックボックスと異なります。複数を一つのグループとして認識させるには、name属性で同じ名前を付けてください。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります。
type="file"
サーバーへファイルを送信する際に、送信するファイルを選択します。ファイル名の入力フィールドと[参照]ボタンが表示されます。サーバー側にはファイルを受け取るための特別なCGI等が必要です。
type="hidden"
隠しデータをサーバーに送信する際に使用します。このタイプのデータは、画面上には表示されませんが、value属性で指定した値がサーバーへ送信されます。
type="submit"
送信ボタンをつくります。
type="reset"
リセットボタンをつくります。このボタンを押すと、それまでに入力した情報をキャンセルして初期状態に戻します。
type="button"
汎用ボタンをつくります。
type="image"
画像のボタンをつくります。使用する画像ファイルはsrc属性で指定してください。またalt属性が必須となります。

ラベルと入力部品を離して配置する場合、関連付けを行う。
<label for="name"></label> label要素にfor属性をつけることで、同じ内容のid属性を持つ要素と関連付けられる
<input type="text" id="name">

 

#21

<textarea></textarea> : 複数行入力のための部品
参考:https://www.tagindex.com/html_tag/basic/empty.html
<button>文字</button> : ボタンを作成する

 

#22

value : 部品の初期値を設定する
textarea では、要素のコンテンツに文字を入力すればそれが初期値となる。
<textarea>文字</textarea>
placeholder 何を入力すべきか、ガイドを表示
<input type="submit" value=""> でも送信ボタンを作成できる。

 

#23

<label for="A">XXX</label>
<input type="password" id="A"> 入力した文字を表示しない(隠す、●などで表示)

<select></select> プルダウン
<option></option> 選択肢
optionをselectで囲む
最初からいずれかの選択肢を選んでおきたい、表示させておきたい場合は
その選択肢のみ<option selected>としておく

select box の行数を指定する
例)<select size="3"> 3行分が表示、他の選択肢を見るにはスクロールする必要が出てくる。

何も入れていないときは1つの選択肢しか選ぶことができないが
multipleという属性を入れれば、Shiftキー、コマンドキーなどで複数選択肢を選べる。
<select multiple>

 

#24

チェックボックス
<fieldset></fieldset>フォームの入力項目をグループ化する際に使用する。

グループの先頭には、<legend>~</legend>で入力項目グループにタイトルをつける
フォームの入力項目グループにタイトルを付ける

<input type="checkbox" id="A"><label for="A">文字</label>
最初からチェックを入れておきたい場合はchecked 属性を入れる。
<input type="checkbox" id="A" checked><label for="A">文字</label>

 

#25

 radioボタン 複数の選択肢から一つだけ選ぶことができる
<input type="radio" name="B" id="A"><label for"A">文字</label>
checked :最初から選択しておくことができる
name 属性 要素に名前を付与