けいが文章を書く場所

けいが文章を書く場所

推敲なんぞ、せん。(タブン)

けいがプログラミングの勉強を始めたようです。#1【表&フォーム】

 

さ、しばらくはプログラミングの基本の基本である、HTMLをお勉強していきます。

HTMLとは、サイトの構造そのものを規定するためのものです。

例えば、このブログで言うと、ヘッダーに「けいが文章を書く場所」と書いてあったり、右側にサイドバーがあったり、ココに記事が書いてあるワケですが、こういった構造は、ぜーんぶHTMLによって形になってます。

 

 

昨日の時点で、ドットインストールの動画を15本目まで見ちゃったので、#1でいきなり「表&フォームをHTMLで作る話」になってます。

まぁ僕の備忘録でしかないと思って、許してつかぁさい。

 

 

HTMLで表を作る

まず、表を作るのに使うタグをまとめます。

  • table:表組み自体。「こっからここまで表でっせ」のサイン。
  • thead:表のヘッダー部分。
  • tbody:表のbody部分。
  • tr (table row):表の行。コレで区切った部分が表の1行分。
  • th (table header):表のヘッダー部分の具体的な項目/内容。
  • td (table date):表のデータ。1マス分の数値や内容を挟む。

 

属性は、

  • colspan:列の結合。

 

じゃァ実践じゃ。

ちなみに、ちょー簡易的ね。

 

↓↓↓

今週の缶ビール消費量推移

曜日 本数
1本
2本
3本
4本
5兆本
5兆円欲しい

 

↑↑↑

と、まぁこんな感じ。

HTMLの方はどうなってるかとゆーと、

 

f:id:kei-T:20170624232414p:plain

 

こんな感じ。

詳しくは書きません。

書きながら感じてるんですが、けっこー時間かかるので。笑

 

 

 表については以上。

次、フォーム。

 

HTMLでフォームを作る

まとめ方変えます。

 

formタグ :「こっからここまでフォームでっせ」のサイン

  action属性:どこに送るか?

  method属性:get / post (データを送る方式)

 

inputタグ

  name属性:データの名前

  type属性:入力欄なら"text" 、ボタンなら"submit"

  value属性:ボタンのテキストを指定

 

じゃァ実践じゃ。 

 

↓↓↓

アンケートじゃ

君の名は?

 

 ↑↑↑

 

HTMLは、

f:id:kei-T:20170624234936p:plain

 こんなん。

 

 

送り先を指定してないので、入力してくれても何も起こりません。笑

あらゆるサイトのログインなんかも、このシステムです:)

 

 

****

こんな感じで終わりかな。

 

ただ、この記事書くの、プログラミングの練習にはなるんですが、めっちゃ時間かかるので、継続するか迷いどころです。。笑

 

まぁこの記事はたまにしか書かなくなったとしても、プログラミングはしばらく頑張ります:)))

 

 

 osimai。