67 行
2.0 KiB
HTML
67 行
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>タイトル</title>
|
|
<link rel="stylesheet" href="/frame/main.css" type="text/css">
|
|
<link rel="icon" type="image/png" href="/frame/icon.png"/>
|
|
</head>
|
|
<body>
|
|
<div id="_frame_container" class="_frame">
|
|
<header id="_frame_header" class="_frame">
|
|
<h1><a href="/index.html">トップページへのリンク</a></h1>
|
|
<nav>
|
|
<ul id="_frame_header_links">
|
|
<!-- ↓の形式でリンクを書いていく -->
|
|
<!-- <li><a href="/blog">ブログ</a></li> -->
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main id="_frame_main" class="_frame">
|
|
<div id="_frame_page_title" class="_frame">
|
|
<h1>
|
|
記事タイトル
|
|
</h1>
|
|
</div>
|
|
<!-- 書きやすさの考慮のため、インデントが下がります。 -->
|
|
<!-- 記事本文ここから -->
|
|
<!--
|
|
id、class等
|
|
_frame で始まるもの以外
|
|
自由に使っていい。
|
|
-->
|
|
<!-- 記事本文ここまで -->
|
|
</main>
|
|
<aside id="_frame_etc" class="_frame">著者情報とかシェアボタンとか</aside>
|
|
<div id="_frame_right" class="_frame">
|
|
<div id="_frame_index" class="_frame">
|
|
<span>目次</span>
|
|
<!--
|
|
目次は自力で設定する必要があります。
|
|
リンク先hタグのaタグのclassに _frame_index_h1 ～ _frame_index_h6 まで
|
|
-->
|
|
<!-- (example)
|
|
<a href="#midashi1" class="_frame_index_h1">見出し1</a>
|
|
<a href="#h2" class="_frame_index_h2">h2</a>
|
|
<a href="#h3" class="_frame_index_h3">h3</a>
|
|
<a href="#h4" class="_frame_index_h4">h4</a>
|
|
<a href="#h5" class="_frame_index_h5">h5</a>
|
|
<a href="#h6" class="_frame_index_h6">h6</a>
|
|
-->
|
|
</div>
|
|
<aside><nav id="_frame_nav" class="_frame">
|
|
<span>関連記事</span>
|
|
<!-- <a href="/dummy.html">ダミー記事</a> -->
|
|
</nav></aside>
|
|
</div>
|
|
<footer id="_frame_footer" class="_frame">
|
|
<!--
|
|
フッターです<br>
|
|
中央揃えになります
|
|
<div>子要素等も問題ありません</div>
|
|
-->
|
|
</footer>
|
|
</div>
|
|
</body>
|
|
</html>
|