HTML入門 2025年度後期(1年)

今日、やったこと [評価用課題]Webフォーム 今日の課題 正解例をあげておきます。 [HTMLファイル]question.html [CSSファイル]style.css 次回は 年明けです。 HTMLは卒業で、新ネタに行きます。 

今日、やったこと [練習問題]フォーム 今日の練習問題 正解例をあげておきます。 フォーム　練習0 index.html ひさしぶりの表。 フォーム　練習1 index.html デザイン設定はタグ、ID、クラスを対象にできる。 style.css 次回は テストをします。 

今日、やったこと フォーム 今日のホワイトボード フォームとは Webブラウザでサーバーに送信するデータを入力・選択する画面。 Webアプリケーションでよく見かける画面。 フォームを作る まずは、頻出タグの紹介。 <form>タグ フォームの始まり、終わりを表す。 method属性でサーバーに送信する際のHTTPのコマンドを指定。大抵、POSTコマンド。 action属性でリクエストするサーバーのURLを指定。 <input>タグ type属性の違いで、入力・選択用の部品がいろいろと作ることができる。 <button>タグ ボタンを作る。type属性をsubmitにすると、<form>タグで指定したURLにリクエスト送信。 図　フォームをつくる 下図の画面を作成した。 図　作成した画面 HTMLは以下のとおり。 送信ボタンをクリックすると type属性がsubmitのボタンをクリックすると、<form>タグのaction属性で指定したサーバーのURLに、method属性で指定したHTTPのコマンドでリクエスト 。 このとき、<form></form>内の<input>タグや<select>タグで入力・選択された内容が、name属性と一緒に送信される。 図　送信ボタンをクリックすると 実際の画面は以下のようになる。 ①クライアント側で入力、ボタンクリック 下図のように入力し、送信ボタンをクリック。 図　送信ボタンクリック...

今日、やったこと 枠線・余白 今日のホワイトボード 枠線・余白 ほとんどのタグは枠線、余白が設定できる。 余白は枠線 内 、枠線 外 の2種類。 図　枠線・余白 ⓪枠線・余白設定前 表示すると以下のとおり。 図　枠線・余白設定前 表示すると、2つの段落間に余白がある。 ブラウザにはデフォルトで適用されるデザイン設定があり、<p>タグにはすでに上下の余白が設定されている。 ①枠線設定 枠線 はプロパティ名 border で設定できる。 　 border : 線種　線幅　線色； 表示すると以下のとおり。 図　枠線設定 ②枠線外の余白設定 枠線外の余白 はプロパティ名 margin で設定。 下表のように、4パターンの設定がある。 設定する余白 設定内容 上下左右同じ margin : 上下左右の余白; 上下、左右 margin : 上下の余白　左右の余白; 上、下、左右 margin : 上の余白　左右の余白　下の余白; 上、下、左、右 margin : 上の余白　下の余白　左の余白　右の余白; 表示すると以下のとおり。 ...