example3 | ナノ

案内

ここは××を扱う○○サイトです。
このサイト内の作品の著作権は管理人ナナシにあります。荒らし・晒し・転載はご遠慮ください。詳しい規約は本棚からご確認ください。
…などなど、サイトの説明をどうぞ。
タイトルは神葬さまよりお借りしました。

和文フォント:XANO明朝
欧文フォント:IM Fell Double Pica SC

HEAD(CSS)

@import url(https://fonts.googleapis.com/css?family=IM+Fell+Double+Pica+SC);

@font-face{
font-family:XANO明朝;
src:url('https://cdn.leafscape.be/XANO-mincho/XANO-mincho_web.woff')
format("woff");
}

body{
margin:3%;
padding:3%;
font-size:12px;
color:#3e3448;
line-height:2;
letter-spacing:2px;
font-family:'IM Fell Double Pica SC',XANO明朝,Meiryo,メイリオ, sans-serif;
background:#eee;
text-align:center;
}

.all{
max-width:650px;
margin:0 auto;
}

.text{
max-width:600px;
text-align:left;
}

.top{
background:#fff;
border:solid 5px #b1e2d5;
padding:10px;
margin:0 auto;
width:100px;
}

.menu{
margin:0 auto;
padding-top:20px;
}

.menu a{
background:#eb5772;
border:solid 2px #3e3448;
line-height:1;
padding:5px;
margin:0 5px;
font-weight:bold;
}

p{
line-height:1;
margin:0;
padding:0;
}

.title{
color:#eb5772;
font-size:70px;
}

.sub{
color:#eb5772;
font-size:30px;
line-height:1;
width:30px;
padding:10px;
margin-right:20px;
background:#fff;
border:solid 5px #b1e2d5;
float:left;
}

a{
text-decoration:none;
color:#eee;
background:#3e3448;
padding:0 3px;
}

a:hover{
color:#3e3448;
background:#b1e2d5;
}

</style>

BODY(HTML)