前回と同じようにhina.htmlを元にindex.htmlを作ります。本とは違いますが、ここからCSSを使います。
目次
HTML
$ cp hina.html index.html
作ったファイルをVimで開きます。
$ vim index.html
iで編集モードにしたらコードを書いていきます。
<!DOCTYPE html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="style.css"> <title>PHP基礎</title> </head> <body> <form method="post" action="check.php"> <label>ニックネームを入力してください。</label> <input type="text" id="nickname" name="nickname"> <input type="submit" value="送信"> </form> </body> </html>
ここでrequired属性を使えば入力チェック機能を実装できますが、この後PHPで作るのであえてつけていません。
esc→:wして、フォームができていれば成功です。このままでは表示が崩れていますのでCSSを使って整えます。
CSS
同じようにCSSファイルを作成します。
$ cp hina.html style.css
作ったファイルをVimで開きます。
$ vim style.css
iで編集モードにしたらコードを書いていきます。
今回は以下のページのコードを使わせていただきました。
esc→:wして、フォームができていれば成功です。
コメント