2013-07-01から1ヶ月間の記事一覧
<html> <head> <meta charset="UTF-8"> <title>H10 C10</title> <link rel="stylesheet" href="css/style_c10.css"> </head> <body> <div id="container"> <div id="header"> <h1 id="name">Typograpy.<span class="num">71</span></h1> <div id="nav"> <ul> <li id="home"><a href="#">HOME</a></li> </ul></div></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>無題ドキュメント</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <div id="header"> <h1>Computer Technology Groups</h1> <div id="nav"> <ul> <li id="eco"><a href="#"><span>エコロジー</span></a></li> </ul></div></div></div></body></html>
<html lang="ja"> <head> <title></title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="nav"> <ul> <li id="home"><a href="#"><span>ホーム</span></a></li> <li id="food"><a href="#"><span>カフェフード</span></a></li> <li id="drink"><a href="#"><span>カフェドリンク</span></a></li> …</ul></div></body></html>
<html lang="ja"> <head> <title></title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="nav"> <ul> <li id="home"><a href="#"><span>ホーム</span></a></li> <li id="food"><a href="#"><span>カフェフード</span></a></li> <li id="drink"><a href="#"><span>カフェドリンク</span></a></li> …</ul></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>薬玉文様(くすだまもんよう)</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <div id="content"> <h1>薬玉文様(くすだまもんよう)</h1> <p>薬玉とは、薬・香料を玉にして錦の袋に入れ、造花や蓬・菖蒲などを飾り、五色の糸を長く垂らしたもの。古代中国で端午の節句に薬玉を柱などに掛け、邪気払いや長寿を祈願す…</p></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>フンデルトヴァッサー・ハウス</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <div id="header"> <h1>フンデルトヴァッサー・ハウス</h1> <h2>ウィーンの市営住宅はこんなに元気だ!</h2> </div> <div id="wrapper"> </div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>プロヴァンス</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <div id="header"> <h1>provence</h1> <p><img src="img/header.gif" width="700px" height="120px"></p> </div> </div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>ガラスの靴の持ち主を捜しています!</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <h1><img src="img/main.gif" width="600px" height="445px"></h1> <div id="header"> <h2></h2></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q26</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="container"> <div id="header"> <h1>Homepage Title</h1> <p>サブタイトルサブタイトルサブタイトル</p> </div> <div id="wrapper"> <div id="content"> <h2>コン…</h2></div></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q25</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="wrapper"> <div id="blocka">ブロックA</div> <div id="blockb">ブロックB</div> <div id="blockc">ブロックC</div> <div id="blockd">ブロックD</div> </div> </body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q21</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="nav"> <ul> <li id="news"><a href="#">新着情報</a></li> <li id="inform"><a href="#">お知らせ</a></li> <li id="product"><a href="#">製品情報</a></li> </ul></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q19</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="wrapper"> <div class="cap"> <p><img src="img/01.jpg" width="148px" height="148px"></p> <p>画像のキャプチャ1</p> </div> <div class="cap"> <p></p></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q23</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="wrapper"> <div id="kumo1"><img src="img/kumo.jpg" width="199px" height="158px"> </div> <p id="p1">段落1のテキストです。段落1のテキストです。段落1のテキストです。</p> <p id="p2">段落…</p></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q21</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="nav"> <ul> <li id="news"><a href="#">新着情報</a></li> <li id="inform"><a href="#">ニュース/お知らせ</a></li> <li id="product"><a href="#">製品情報</a></li> </ul></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q22</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="nav"> <ul> <li id="news"><a href="#">新着情報</a></li> <li id="inform"><a href="#">ニュース/お知らせ</a></li> <li id="product"><a href="#">製品情報</a></li> </ul></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q18</title> <link rel="stylesheet" href="styleQ18.css"> </head> <body> <div id="container"> <p><a href="#">f:id:web-mind:20130714223625j:image</a></p> </div> </body> </html> @charset "UTF-8"; /*リセット*/ body, div { margin: 0; paddin…
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q17</title> <link rel="stylesheet" href="styleQ17.css"> </head> <body> <div id="container"> <h1><img src="img/03.jpg"></h1> <p>テキストの位置を指定します。</p> </div> </body> </html> @charset "UTF-8"; /*リセット*/ body, div, img { margin: 0; paddin…
<html lang="ja"> <head> <meta charset="UTF-8"> <title>Q16</title> <link rel="stylesheet" href="styleQ16.css"> </head> <body> <div id="container"> <h1>Background Design</h1> <p>Sharing your digital photos with family and friends is such an easy thing to do these days.</p> </div> </body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>ボタンのように機能するリンクを設定しなさい</title> <style> body,ul,li { margin: 0; padding: 0; } a { text-decoration: none; } body { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; padding: 50px 0 0 100px; } ul { width: 220px; list-styl</meta></head></html>…
<html lang="ja"> <head> <meta charset="UTF-8"> <title>リンクにマウスが乗った時に文字がオレンジ色になるよう指定</title> <style> body { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; } h1 { font-size: 16px; } p a { border-bottom: 1px dotted skyblue; color: skyblue; } p a:hover { color: oran</meta></head></html>…
<html lang="ja"> <head> <meta charset="UTF-8"> <title>様々な文字の設定</title> <style> p { padding: 0; margin: 0; } body { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; letter-spacing: -0.1em; font-weight: 500; } p#a { font-size: 100%; } p#b { font-size: 1em; } p#c { font-siz…</meta></head></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>様々な枠線の設定</title> <style> body { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; width: 400px; font-size: 18px; } p#a { border: 1px solid; padding:5px } p#b { border: 3px solid; padding: 5px; } p#c { border: 1px solid…</meta></head></html>
h1の背景を白色にする場合 h1 { background-color: #FFFFFF; } h1の文字だけを白色にする場合 h1 { color: #FFFFFF; }
body { font-size: 16px; color: #333333; font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; line-height: 1.5; }
h1、h2、h3、p、ul、li、img { margin: 0; padding: 0; }
<link rel="stylesheet" href="css/style.css"></link>
Copyright © CatCafé. All Rights Reserved. <p><small>Copyright © CatCafé. All Rights Reserved.</small></p>
<table border="1"> <tr> <th>名前</th><th>オス・メス</th><th>特徴</th><th>性格</th><th>写真</th> </tr> <tr> <td>あたる</td><td>オス</td><td>大きな目と耳<br>まがったしっぽ</td><td>マイペース</td><td><image src="img/ataru.jpg"</td> </tr> </table>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>猫と遊べる池袋のカフェ CatCafe</title> </head> <body> <h1>CatCafeのにゃんこ紹介</h1> <h2>あたる(白キジトラ・オス)</h2> <p>目と耳が大きくてすばらしくイケメン。鳴き声もなかなかかわゆい。性格はいたってマイペース。 段ボール箱のかどや柱で爪とぎをするのが大好き。 </p> <p><image src="img/ataru.jpg"></p> <p>特徴<br> 大きな目と</p></body></html>…