課題
HTML <html lang="ja"> <head> <meta charset="utf-8"> <title>H13C13</title> <link rel="stylesheet" href="css/H13C13.css"> </head> <body> <div id="container"> <div id="wrapper"> <div id="content"> <h1><img src="img/13/logo.gif" width="267" height="129" alt="Patisserie camellia"></h1> </div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>H12C12</title> <link rel="stylesheet" href="css/H12C12.css"> </head> <body> <div id="container"> <div id="header"> <h1><img src="img/12/logo.gif" width="290" height="38" alt="サンプルスタイルシートカンパニー"></h1> <div id="nav"> <ul> </ul></div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>H11C11</title> <link rel="stylesheet" href="css/H11C11.css"> </head> <body> <div id="container"> <div id="header"> <h1>Café de la plante</h1> <p>サブタイトルサブタイトルサブタイトル</p> <div id="nav"> <ul> <li><a href="#">トップページ</a></li></ul></div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>ECOLOGY</title> <link rel="stylesheet" href="style.css"> </head> <body> <div id="container"> <div id="header"> <h1>ECOLOGY【エコロジー】</h1> <p>Computer Technology Groupsでは、<br> グループをあげてエコロジー／環境問題に取り組んでいます。<br> 成果や実績を地域に還元することもポリシー…</p></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="utf-8"> <title>H10C10</title> <link rel="stylesheet" href="css/H10C10.css" media="all"> </head> <body> <div id="container"> <div id="header"> <h1>Typograpy.<span>71</span></h1> <div id="nav"> <ul> <li><a href="#">HOME</a></li> <li></li></ul></div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>H09C09</title> <link rel="stylesheet" href="css/H09C09.css" media="all"> </head> <body> <div id="container"> <div id="header"> <h1><a href="#">Computer Technology Groups</a></h1> <div id="nav"> <ul> <li></li></ul></div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="utf-8"> <title>H08C08</title> <link rel="stylesheet" href="css/H08C08.css"> </head> <body> <div id="container"> <div id="header"> <h1><span>今月の本棚</span><br> 推理小説</h1> <div id="header-nav"> <ul> <li><a href="#"><span>ホーム</span></a></li> <li>…</li></ul></div></div></div></body></html>
HTML <html lang="ja"> <head> <meta charset="utf-8"> <title>H07C07</title> <link rel="stylesheet" href="css/H07C07.css" media="all"> </head> <body> <div id="container"> <h1>薬球文様<span>（くすだまもんよう）</span></h1> <P> 薬玉とは、薬・香料を玉にして錦の袋に入れ、造花や蓬・菖蒲などを飾り、五色の糸を長く垂らしたもの。古代中国で端午の節句に薬玉を柱などに掛け、邪気払いや長…</p></div></body></html>
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>H06C06</title> <link rel="stylesheet" href="css/H06C06.css" media="all"> </head> <body> <div id="container"> <div id="header"><h1>建築散歩</h1></div> <div id="wrapper"> <div id="content"> <div id="content-top"> <h2>フンデルトヴァッサー・ハウス…</h2></div></div></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>H05C05</title> <link rel="stylesheet" href="css/H05C05.css" media="all"> </head> <body> <div id="container"> <div id="header"> <h1>provence</h1> </div> <div id="wrapper"> <div id="content"> <p></p></div></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>H04C04</title> <link rel="stylesheet" href="css/H04C04.css" media="all"> </head> <body> <div id="container"> <div id="header"> <h1>卵料理カフェ Cockeyolly</h1> </div> <div id="content"> <h2><img src="img/04/title.gif" alt="今月のおすすめ"></h2></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>H03C03</title> <link rel="stylesheet" href="css/H03C03.css"> </head> <body> <div id="container"> <div id="main"> <h1>ガラスの靴の持ち主を捜しています！</h1> </div> <div id="lead"> <img src="img/03/b_1.gif" alt="川崎アゼリア ・オープン懸賞 パソコンで応募する方は"> <p>下記の「…</p></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>H02C02</title> <link rel="stylesheet" href="CSS/H02C02.css"> </head> <body> <div id="container"> <div id="header"> <h1>石垣島観光ガイド</h1> </div> <p class="lead"> 石垣島は八重山諸島の中で一番大きな島で、沖縄で3番目に 大きな島です。沖縄からは、空路で約1時間、沖縄より台湾に 近く南に位置します。気候は亜熱帯…</p></div></body></html>
<html lang="ja"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="css/H01C01.css" media="all"> <title>H01C01</title> </head> <body> <div id="content"> <h1>見出しと段落のレイアウト</h1> <p>同じ内容の文章であっても、その表現の仕方によって 読者に与える印象は大きく変化します。 文章のレイアウトを考えることはより正確に、より効果的に 情報を伝えるためにとても重要なことです。</p> <…</div></body></html>
Q27 フォーム（お問い合わせフォーム） <h1>お問い合わせフォーム</h1> <form action="#" method="post"> <p>名前：<input type="text" name="name" size="18" maxlength="9" value="お名前"></p> <p>内容：<textarea name="subject" rows="6" cols="45"> お問い合わせ内容</textarea></p> <p><input type="submit" value="送信"></p> </form> Q28 フォーム（ラジオボタン） <h1>ラジオボタ…</h1>
Q24 以下のように表示するよう設定をしなさい div { width: 300px; } #p1 img { float: left; } #p2 { clear: left; } #p3 img { float: right; } #p4 { clear: right; } <div> <p id="p1"> <img src="img/q20.jpg" alt="レモン"> 段落１のテキストです。段落１のテキストです。段落１のテキストです。 </p> <p id="p2"> 段落２の</p></div>…
Q21 マウスが乗った状態を設定しなさい ul { width: 100px; text-align: center; } li { font-weight: bold; } li a{ display: block; padding: 20px 10px 20px 10px; } li a:link,li a:visited{ color: #ffffff; } a#new:link,a#new:visited{ background-co…
Q16 以下の表示になるよう設定しなさい h1,p { margin: 0; padding: 0; } body { background-color: #222222; background-image: url(img/q16.gif); background-repeat: repeat-y; background-position: 280px; font-family: "Hiragino Kaku Gothic ProN", M…
Q08 使用している要素が、h1、h2、h3、ｐ、ul、li、img の場合のリセットCSSを記述しなさい h1,h2,h3,p,ul,li,img { margin: 0; padding: 0; } Q09 bodyを、プロパティ（文字サイズ:16px、文字色:#333333、書体:ゴシック体、行送り:1.5）で指定しなさい body…
Q01 DTD HTML5で基本構造を記述しなさい （meta要素 文字コード指定も含む） A <html lang="ja"> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> </html> Q02 池袋で猫カフェ「CatCafé」を開いてお客さんを呼びたいと思います 適切なtitle要素を記述しなさい A <title>猫カフェ 池袋|CatCafé</title> Q03 以下の内容をマークアップし…
