Geeklogのnouveauテーマではなにやら色々な仕掛けが最初から用意されている。
それらはタグを記述するだけでよいようになっているので、日本語でのメモと効果の確認を以下で行っています。
次のように記述するとコンソール表示のようになります。
<pre>まずはpreタグです</pre>
まずはpreタグです
次のように記述するとメモやTIPSのようになります。
<span class="note">次はspanタグでクラスがnote</span>
次はspanタグでクラスがnote 次のように記述すると情報表示のようになります。
<span class="info">次はspanタグでクラスがinfo</span>
spanタグでクラスがinfo 次のように記述するとアイデアや工夫やTIPSのようになります。
<span class="idea">次はspanタグでクラスがidea</span>
spanタグでクラスがidea 次のように記述するとヘルプのようになります。
<span class="help">次はspanタグでクラスがhelp</span>
spanタグでクラスがhelp 次のように記述するとダウンロードのようになります。
<span class="down">次はspanタグでクラスがdown</span>
spanタグでクラスがdown 次のように記述すると注意のようになります。
<span class="alert">次はspanタグでクラスがalert</span>
spanタグでクラスがalert次はブロッククオートで囲みます。
<blockquote><p>ブロッククオートで囲みます。</p></blockquote>
ブロッククオートで囲みます。
一行だとブロッククオートのマークが綺麗に表示されないので二行以上必要です。
次はリスト表示の色々です。
まずはイメージでのリストです。
- <ul class="arrow"><li>...</li></ul>
- <ul class="bug"><li>...</li></ul>
- <ul class="cart"><li>...</li></ul>
- <ul class="check"><li>...</li></ul>
- <ul class="script"><li>...</li></ul>
次にリスト項目の小丸です。
- <ul class="bullet-blue"><li>...</li></ul>
- <ul class="bullet-grey"><li>...</li></ul>
- <ul class="bullet-plus"><li>...</li></ul>
- <ul class="bullet-rss"><li>...</li></ul>
- <ul class="bullet-star"><li>...</li></ul>
リストサンプルの最後は数値です。
ulタグは次のように宣言してliで数値を指定します。
<ul class="number">...</ul>
- <li class="num-1">...</li>
- <li class="num-2">...</li>
- <li class="num-3">...</li>
- <li class="num-4">...</li>
- <li class="num-5">...</li>
- <li class="num-6">...</li>
- <li class="num-7">...</li>
- <li class="num-8">...</li>
- <li class="num-9">...</li>
その他にもJavaScriptなどで効果が用意されてますので英語ですが配布サイトのドキュメントをご覧下さい