偽ニコニコ動画とは、ニコニコ大百科に貼ることが出来る偽ニコニコ動画サムネイルである。
概要
表示サンプル
ソースコード
下の使用手順に従って、書き換えてご使用下さい。
<div style="float: left; margin: 0.5em 1em;">
<div style="background-image: url(/oekaki/278076.png); width: 314px; background-repeat: no-repeat; height: 178px; color: #333333; font-family: 'Mona','IPAMonaPGothic','IPA モナー Pゴシック','MS PGothic AA','MS PGothic','ＭＳ Ｐゴシック',sans-serif; overflow: hidden;">
<div style="text-align: left; font-size: 10px; letter-spacing: 0px; margin-left: 9px; padding-top: 27px;">
<div style="width: 314px; height: 14px;">
再生：<span style="font-weight: 700;">再生数</span> コメント：<span style="font-weight: 700;">コメント数</span> マイリスト：<span style="font-weight: 700;">マイリスト数</span>
</div>
</div>
<div style="width: 314px; padding-top: 1px; line-height: 14px;">
<div style="width: 217px; float: right;">
<div style="text-align: left; font-size: 10px;">
<span style="font-weight: 700;">投稿日 投稿時間</span> 投稿
</div>
<div style="text-align: left; font-size: 12px; line-height: 16px; color: #667777; text-decoration: underline; padding-right: 8px; font-weight: 700;">
<a href="動画(リンク先)URL" style="background-image: none;" rel="nofollow" target="_blank"><span style="text-decoration: underline;">動画タイトル</span></a>
</div>
<div style="text-align: left; font-size: 10px; line-height: 14px; padding-right: 8px; margin-bottom: 2px;">
動画説明文...
</div>
</div>
<div style="width: 92px; float: left;">
<div style="margin-left: 11px; margin-top: 2px;">
<a href="動画(リンク先)URL" style="padding-right: 0; background-image: none;" rel="nofollow" target="_blank"><img src="サムネ画像URL" height="60" width="80"></a>
</div>
<div style="text-align: left; font-size: 10px; letter-spacing: 0px; height: 16px; margin-left: 9px; margin-top: 3px;">
<span style="font-weight: 700;">再生時間</span>
</div>
</div>
<div style="clear: both; width: 280px; margin-left: 9px; background-color: #ffffff; border: #999999 solid 2px; font-size: 12px; font-weight: 700; line-height: 15px; padding: 6px;">
コメント
</div>
</div>
</div>
</div>
使用手順
- コピペする
- 次項目のスタイルシートにclear: both;を追加
例：<p style="clear: both;"> - 太字部分を書き換える
- ソースの、この色の背景色の部分を使用箇所に応じて合わせる
margin部分を、以下のように変更する。
- 上が<h2>見出しの場合
- margin-topの値 0.45em
- 上が<p>段落の場合
- margin-topの値 0em
- 下が<h2>見出しの場合
- margin-bottomの値 1em
- 下が<p>段落の場合
- margin-bottomの値 1em
- 左右とも偽ニコニコ動画を貼る場合
- 左側：margin-rightの値 0em
右側：margin-leftの値 0em - 続けて次行にも偽ニコニコ動画を貼る場合
- margin-bottomの値 0.35em
※この場合、次行の偽ニコニコ動画のmargin-topの値は0em? - 右側に本物の動画Iframeを貼る場合
- margin-rightの値 0em
※この場合、本物のIframeを記述した<p>要素にはclear: both;を指定せず、その次の要素に記述する事? - 続けて次行にも本物のIframeを貼る場合
- margin-bottomの値 0em
マージンのtop,right,bottom,leftの指定方法についてはニコニコ大百科:HTMLタグ一覧を参照してください。
注意事項
サムネ画像は、大百科に貼る事の出来る画像なら何でも使用可。画像サイズは、60×80pxになります。
外部リンク『
』、動画リンク『
』のアイコンは付随しませんのでご注意下さい。
偽ニコニコ動画の使用例
関連商品
|
|
関連項目
- 35
- 0pt
