プログラミング学習 masa blog (pa○zaで就職できるのか!?)

masaです。 持病(アトピー)と格闘しながら、家事育児を行い 且つプログラミング学習をしつつ転職を夢見る一般男性。 主に、プログラミング学習、アトピー、育児について思ったことを自分のメモがわり書いていくつもりです。 恥ずかしいし頭悪いからあんまり見ないでね。

今日はチェックボックスその他 続き

前回の続きからやっていきます。

 

HTML5で利用できる入力部品の例

今回のはそこまで頻繁には使わなさそう。。。

古いブラウザによっては対応してないそうだ。

 

でもdateはよく見かけますので使えそうです。

 

<p class="A"><input type="color"></p>    
<p class="B"><input type="date"></p>    
<p class="C"><input type="number"></p>    
<p class="D"><input type="range"></p

 

f:id:masamonkey:20200731005305p:plain

1番上が色を細かく選べるやつです。

2番目がカレンダーが表示されて任意の日付を入れれるやつです。

3番目は数字のみ入力可能なフォーム(今のところ使いどころが思い浮かばない)

4番目は音のボリュームとか操作するようなやつですね。

 

次にボタンです。

<input type="button" value="ok">
<button>ok</button>

両方とも見た目は同じです。

 

 

ですが、

<button>ok</button>

こちらのほうが、タグの中に画像を入れたりできるのでこちらのほうが良いとのこと。

 

disable属性を追加するとボタンが押せなくなるようになる。

input type="button" value="ok" disabled>
<button disabled>ok</button>

<input type="button" value="ok" >
<button>ok</button>

   

 

最後にformタグを使って、入力した値をどこのプログラムに送信するか、という方法

(今はまだ覚えるの早いらしい)

 

<form action="process.php" method="post">
        <label for="">担当者名 <input type="text" name="username"></label>
        <label for="">タスク <input type="text" name="task"></label>
        <button>追加</button>
    </form>

 

  

 

担当者名、タスクを入力して追加ボタンを押すと、process.phpにpost形式で送信されるよ、ということらしい。

 

phpはまだあまりやったことが、今後覚えていきたい!

 

今日は以上。