←このボタンをクリックして表示するWebページと、同じように見えるHTMLを以下に作成してください。(htmlタグなど、小文字を使っても影響がない範囲で小文字を使ってください。)
body内を追加、修正してください。
body内で最も外側のブロック要素にはformを使ってください。
この属性は、action methodの順番に指定してください。
そして、サーバーのプログラムは、../../cgi-bin/info2.phpを使ってください。
input要素は3箇所で使っています。その属性は、type、
value、
name の順番に指定してください。
name属性の名前は、目標の動作結果から判断できます。文字化けが生じて、
IEブラウザをご使用であればエンコード（画面右クリック操作のメニュー）を変えて確認してください。
なお、商品群へのリンクファイルは、goodsB.htmlまたは
goodsA.htmlの名前で、
これらファイルは ex のディレクトリ内にあります。
また、<br clear="both">を2箇所で使っています。
(画像要素でalign="right"の指定を使っているため)
←上記で編集した内容を、ブラウザで確認するボタンです
上のボタンで確認した後、正しいと思ったら、下の評価ボタンをクリックください。
←目標と同じ結果が得られるように修正してからクリックください。（下の枠に出たメッセージの⇒をクリックすると、違うと判断される近辺の行が反転します）
←作り方はいろいろですが、わからない場合や正解しない場合は、答えを見て出題されるパターンを学習し、再度チャレンジしてください。
formのmethodは=で、"get" または"post"を指定しますが、
それは目標ページのボタン操作から判断してください。
なお、このようにformのactionで動作させるボタンのtypeは"submit"を指定しなければなりません。
以下で、この問題で使われる画像ファイルを示します。
これらのファイルは、 出題されるHTMLの位置と同じディレクトリ内に位置するimgディレクトリ内に存在します。
gA1.png→ |
gA2.png→ |
gB1.png→ |
gB2.png→ |
なお出題パターンは、ブラウザの更新操作で 異なる問題にできます。更新操作によりさまざまな問題にチャレンジして、このパターンのどんな問題でも答えを見ないで出来るまで何回でも行ってみましょう。タグなどを完全に暗記する必要はありませんが、タグの意味が理解できて、 作ったものがブラウザでどう反映されるかを想像できるようにすることが大切です。