night-style
このコミットが含まれているのは:
コミット
2569f94b50
|
@ -13,6 +13,9 @@
|
|||
<h2>一覧 (新着順)</h2>
|
||||
|
||||
<dl>
|
||||
<dt><a href="./styles/night.html">Night Style</a></dt>
|
||||
<dd>2024-01-03 (陰暦11月22日)</dd>
|
||||
<dd>黑を基本とした汎用的な CSS</dd>
|
||||
<dt><a href="./styles/zote.html">Zote Style</a></dt>
|
||||
<dd>2024-01-01 (陰暦11月20日)</dd>
|
||||
<dd>某ウェブサイトを眞似した CSS 第二段</dd>
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
<dt><a href="./webring.html">ウェブリング (リンク集)</a></dt>
|
||||
<dd>2023-12-15 (陰暦11月03日)</dd>
|
||||
<dt><a href="./csslist.html">美々のCSS素材集</a></dt>
|
||||
<dd>2024-01-01 (陰暦11月20日)</dd>
|
||||
<dd>2024-01-03 (陰暦11月22日)</dd>
|
||||
</dl>
|
||||
|
||||
<h2>2. 文章</h2>
|
||||
|
|
|
@ -0,0 +1,142 @@
|
|||
/* Night Style, 2024-01-03 */
|
||||
html, body,
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
blockquote, p, pre,
|
||||
br, cite, code, em, hr, kbd, samp, strong, var,
|
||||
a,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
img
|
||||
{
|
||||
border: 0 solid #7d7d7d;
|
||||
font-size: 100%;
|
||||
font-style: normal;
|
||||
font-weight: inherit;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body
|
||||
{
|
||||
background: #2b2b2b;
|
||||
color: #f3f3f3;
|
||||
margin: 1em 2.5em 3em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6
|
||||
{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
h1
|
||||
{
|
||||
font-size: 200%;
|
||||
border-width: 0 0 medium;
|
||||
margin-bottom: 0.5em;
|
||||
padding-bottom: 0.125em;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
h2, h3
|
||||
{
|
||||
font-size: 150%;
|
||||
margin-bottom: 0.66em;
|
||||
padding-top: 0.66em;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
h2
|
||||
{
|
||||
border-width: medium 0 thin;
|
||||
padding-bottom: 0.165em;
|
||||
}
|
||||
|
||||
h3
|
||||
{
|
||||
border-width: thin 0 0;
|
||||
}
|
||||
|
||||
h4
|
||||
{
|
||||
font-size: 112.5%;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 0.89em;
|
||||
}
|
||||
|
||||
h5
|
||||
{
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
h6
|
||||
{
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
dl, ul, ol, p, pre
|
||||
{
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
blockquote, ul, ol,
|
||||
dd
|
||||
{
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
blockquote
|
||||
{
|
||||
border-width: 0 0 0 medium;
|
||||
}
|
||||
|
||||
ul
|
||||
{
|
||||
list-style: disc;
|
||||
}
|
||||
|
||||
strong, var
|
||||
{
|
||||
color: #f09199;
|
||||
background: none;
|
||||
}
|
||||
|
||||
cite,
|
||||
dt,
|
||||
em,
|
||||
samp kbd
|
||||
{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
pre,
|
||||
code, samp, kbd
|
||||
{
|
||||
background: none;
|
||||
color: #a0d8ef;
|
||||
}
|
||||
|
||||
hr
|
||||
{
|
||||
border-width: 0 0 thin;
|
||||
padding-top: 1px; /* netsurf */
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
img
|
||||
{
|
||||
border: thin solid;
|
||||
font-style: italic;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
background: none;
|
||||
color: #deb068;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:hover
|
||||
{
|
||||
text-decoration: none;
|
||||
}
|
|
@ -0,0 +1,132 @@
|
|||
<!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN">
|
||||
<html lang="ja">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="./night.css">
|
||||
<title>Night Style - 美々のCSS素材集</title>
|
||||
<body>
|
||||
|
||||
<h1>Night Style</h1>
|
||||
|
||||
<p>黑を基本とした汎用的な CSS です。</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="./night.css">保存用: night.css</a></li>
|
||||
<li><a href="./bibi.html">Bibi Style</a> を更に汎用化したもの</li>
|
||||
<li>特徴の無いところが特徴だといへる</li>
|
||||
<li>わりと綺麗かも</li>
|
||||
</ul>
|
||||
|
||||
<h2>記述見本</h2>
|
||||
|
||||
<p>以下、見本です。</p>
|
||||
|
||||
<h3>リスト</h3>
|
||||
|
||||
<p>リストは次の通りです。</p>
|
||||
|
||||
<h4>順序なしリスト</h4>
|
||||
|
||||
<ul>
|
||||
<li>日本語</li>
|
||||
<li>英語</li>
|
||||
<li>中國語
|
||||
<ul>
|
||||
<li>簡體</li>
|
||||
<li>繁體</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h4>順序つきリスト</h4>
|
||||
|
||||
<ol>
|
||||
<li>朝起きる</li>
|
||||
<li>寢坊する</li>
|
||||
<li>急いで
|
||||
<ol>
|
||||
<li>着替へる</li>
|
||||
<li>出掛ける</li>
|
||||
</ol>
|
||||
</ol>
|
||||
|
||||
<h4>定義リスト</h4>
|
||||
|
||||
<dl>
|
||||
<dt>林檎</dt>
|
||||
<dd>赤い果物</dd>
|
||||
<dt>キウイフルーツ</dt>
|
||||
<dt>マタタビ</dt>
|
||||
<dd>酸つぱい果物</dd>
|
||||
<dd>ネコを寄せつける</dd>
|
||||
<dt>梨</dt>
|
||||
<dd>林檎に似た果物
|
||||
<dl>
|
||||
<dt>洋梨</dt>
|
||||
<dd>西洋の梨</dd>
|
||||
</dl>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<h3>引用</h3>
|
||||
|
||||
<h4>ブロック引用</h4>
|
||||
|
||||
<blockquote cite="https://example.com/">
|
||||
<p>This domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission.</p>
|
||||
</blockquote>
|
||||
|
||||
<h4>言及</h4>
|
||||
|
||||
<p><cite>GNUプロジェクト</cite>のウェブサイトによると GNU の撥音はヌーではなくグヌーです。</p>
|
||||
|
||||
<h3>色々な要素</h3>
|
||||
|
||||
<h4>強調</h4>
|
||||
|
||||
<ul>
|
||||
<li><strong>STRONG による強調はこの通りです。</strong></li>
|
||||
<li>EM要素による強調は、<em>こんな</em>感じです。</li>
|
||||
</ul>
|
||||
|
||||
<h4>計算機關聯</h4>
|
||||
|
||||
<ul>
|
||||
<li>コード斷片: <code>echo Hello.</code></li>
|
||||
<li>變數: <var>$NAME</var> に名前を代入します。</li>
|
||||
<li>入力/出力: <kbd>echo Hello.</kbd> と入力すると <samp>Hello.</samp> と出力されます。</li>
|
||||
</ul>
|
||||
|
||||
<p>整形濟みテキスト (PRE) は次の通りです。</p>
|
||||
|
||||
<pre><samp>$ <kbd><var>script</var>=hello.sh</kbd>
|
||||
$ <kbd>cat <var>$script</var></kbd></samp>
|
||||
<code>#!/bin/sh
|
||||
hello() {
|
||||
echo Hello, <var>$1</var>.
|
||||
}
|
||||
hello World</code></pre>
|
||||
|
||||
<h4>微妙な要素</h4>
|
||||
|
||||
<h5>内容の區切り</h5>
|
||||
|
||||
<p>内容の區切りは次の通りです。</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<p>使用法がわかりません。</p>
|
||||
|
||||
<h5>H5 見出し</h5>
|
||||
|
||||
<p>筆者は HTML で H5 や H6 を殆ど使用しません。</p>
|
||||
|
||||
<h6>H6 見出し</h6>
|
||||
|
||||
<p>ところで、H7 要素が存在しない。</P>
|
||||
|
||||
<h2>附加情報</h2>
|
||||
|
||||
<ul>
|
||||
<li><a href="../csslist.html">美々のCSS素材集</a></li>
|
||||
</ul>
|
読み込み中…
新しいイシューから参照