テンプレート01

10題用テンプレートです。（使用規約）
すっごいシンプル！調整すれば何題でも。お好みで。
背景グラデーションは WebGradients、shade 等が参考になります。単色や画像に変更しても◎
ソースコード

<!DOCTYPE html>
<html lang="ja">
<head>
<title>テンプレート01</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<style>
*{ margin: 0; padding: 0; box-sizing:border-box; }
html, body{ min-height: 100%; }
body{ background-image: linear-gradient(-225deg, #E3FDF5 0%, #FFE6FA 100%); /*　お好きなものに変えてください */ color: #333344; font-size: 13px; line-height: 34px; letter-spacing: 1.8px; font-family: 'メイリオ', 'Meiryo',  '游ゴシック体', 'Yu Gothic', 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; text-align: center; }
section{ background-color: rgba(255,255,255,.5); width: 500px; margin: 12vh auto 30px; padding: 60px 5px;
box-shadow:
0 0 0 1px rgba(0,0,0,0.5),
0 0 0 3px rgba(255,255,255,.9),
0 0 0 5px rgba(0,0,0,0.5),
5px 5px 20px -4px rgba(0,0,0,.2); /*上から、内側の細ライン、真ん中の白、外側の太ライン、影 */ }
p{ color: #666; font-size: 0.8em; line-height: 20px; letter-spacing: 0.5px; margin-top: 50px; }
a{ color: #666; }
</style>
</head>
<body>
<section>
01.<br>
02.<br>
03.<br>
04.<br>
05.<br>
06.<br>
07.<br>
08.<br>
09.<br>
10.<br>
<p>
2017.3.20<br>
10titles template<br>
</p>
</section>
</body>
</html>