CSSの書き方
▼よく使う要素
<a>〜</a>
リンクをつけられます。
ナノでは#page1_リンク文字#などの独自タグを用いることが推奨されています。
独自タグを使った場合、<a href="/ユーザID/page/1">リンク文字<a>というように自動で変換されます。

<div>〜</div>
<div>自体は特別な意味を持ちません。これを使うことで、その範囲内をブロックレベル要素(ページの横いっぱいに広がるボックスのようなもの)として扱うことができます。
なお、<div>の前後は必ず改行されます。

当テンプレートでは一番使う要素です。
これにクラス名を付けて横幅(width)や枠線(border)、背景色(background-color)などの様々な装飾を行っています。

<span>〜</span>
<span>自体は特別な意味を持ちません。<div>と違う点は、<span>はインライン要素といい前後に改行が入らないので、行内で使うことができることです。

当テンプレートでは<div>と同じくらい頻繁に使う要素です。
これにクラス名を付けて文字色(color)や下線(border-border)、背景色(background-color)などの様々な装飾を行っています。

<img src="画像URL" alt="" />
画像を表示できます。<span>と同じくインライン要素なので、行内で使うことができます。

ナノでは#mtr数字#の貼り付け用独自タグを使うことで同じ効果が得られます。
その場合、<img src="画像URL" width="横幅" height="縦幅" border=0 />というように自動で変換されます。

上の見出しのようなやり方は、素材管理で各画像に付けられたURLタグ(URLのみに変換)を使って手動で記述するときに使います。
<img src="#mtr数字_url#" alt="" />
厳密にXHTMLで記述する場合、『alt=""』を必ず指定しなければならないとされているので使っているだけで、HTMLで記述するばいは特に必要ありません。
基本的には貼り付け用独自タグを使っても一応画像は表示される(ブラウザが拡大解釈してくれる)ので、この部分はお好みでそうぞ。

ちなみに
 当テンプレートでは、基本的に下記のタグはつかっておりません。
<h1>、<h2>、<h3>、<h4>、<h5>、<h6>
 これは見出しを意味するもので、SEO(search engine optimization:サーチエンジンの検索結果のページの表示順の上位に自らのWebサイトが表示されるようにする)対策として、一般のサイトでは積極的に使うよう推奨されています。
 なぜかというと、サーチエンジンの検索ロボットがここに書かれたキーワードを優先して拾うため、検索ワードにヒットしやすくなるのです。
 当テンプレートをご利用の方の中には二次創作系サイトの方もいらっしゃるようですし、できるだけ使わないようにしています。
 metaタグはあくまでお守りみたいなものですので、絶対ではありませんからね。可能性は下げられるだけ下げておいたほうが良いでしょう。

 ただその分、主にDIV要素("midashi"などのクラス名をつき)を代用として使っているため、HTML内にDIVがいくつもでてきます。分かりづらくてすみません。
 一応、こういう考えのもとに使っていますので、ご理解いただけますと幸いです。
PREV][NEXT
×
人気急上昇中のBL小説
BL小説 BLove
- ナノ -