rose wall paper

サイトの説明とかあればここに。更新履歴やランキングリンク、カウンター等
Information // 子ページとソース

●●××を扱う▽▽サイトです。強調はこうなります。トップのメニュー以外のリンクはこんな感じです。

壁紙素材はblancbox様よりお借りしました。

どんな壁紙でもあわせやすいと思います。ボックスの中の文字は<p></p>で囲んでください。背景に半透明の黒枠が出ます。段落ごとに分けるか全部をひとまとめにするかはお好みで。

自動改行しない設定で作成しています

HEAD
<style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Catamaran:900); *{margin: 0; padding: 0;} body{ color:#fff; background-color:#191919; font-size:12px; letter-spacing:2.5px; line-height:2; font-family:Meiryo,メイリオ,Osaka,"MS ゴシック", sans-serif; } #menu,h1,h2{letter-spacing:0; font-family: 'Catamaran', sans-serif; text-align:center;} #menu a,h1,h2{color:rgba(25,25,25,0.5); -webkit-text-stroke:1px #fff;} #menu{margin:0 0 10px;} #menu a{ display:block; width:80%; max-width:400px; font-size:24px; margin:0 auto; padding:3px 0; border-right:#fff 1px solid; border-bottom:#fff 3px double; } h1{font-size:38px; margin-top:5%;} h2{ font-size:24px; margin:45px auto 15px; position:relative; width:80%; max-width:400px; } h2:before,h2:after{ content:""; position:absolute; top:49%; width:25%; border-bottom:#fff 3px double; } h2:before{left:0;} h2:after{right:0;} a{text-decoration:none; color:#eee; background-color:rgba(220,220,220,0.4);} a:hover{opacity:0.6;} .mk{font-weight:bold; color:#eee; border-bottom:#eee 1px dotted;} .kz{text-align:center; margin-bottom:20px; font-size:16px;} .hako{ position:relative; width:80%; max-width:400px; margin:20px auto; padding:10px 15px; -webkit-box-sizing:border-box; box-sizing:border-box; } .hako::before,.hako::after{ position:absolute; content:''; width:20%; height:50%; -webkit-box-sizing:border-box; box-sizing:border-box; } .hako::before{ top:0; left:0; border-top:#fff 3px double; border-left:1px double #fff; } .hako::after{ bottom:0; right:0; border-bottom:#fff 3px double; border-right:1px double #fff; } .hako p{ background-color:rgba(25,25,25,0.8); margin:5px 0; padding:10px; } </style>
BODY // トップ
<h1>rose wall paper</h1> <div id="menu"><a href="">Information</a><br> <a href="">Main Contents</a><br> <a href="">Bookmark</a></div> <div class="hako"><p>サイトの説明とかあればここに。更新履歴やランキングリンク、カウンター等</p></div>
BODY // 子ページ
<h2>Information</h2> <div class="hako"> <p>●●××を扱う▽▽サイトです。<span class="mk">強調はこうなります</span>。トップのメニュー以外のリンクは<a href="">こんな感じ</a>です。</p> <p>どんな壁紙でもあわせやすいと思います。ボックスの中の文字は<p></p>で囲んでください。背景に半透明の黒枠が出ます。段落ごとに分けるか全部をひとまとめにするかはお好みで。</p> </div>