Ninja☆BT ラインの付け方 || 一口メモ

Info

日々、ニンブロのテンプレート製作に励んでいます。お見苦しい箇所があるかと思いますが、お許し下さいマセ。また、お気付きの点などございましたらお知らせして下さると嬉しく思います。

各テンプレの質問などは、遠慮なくご質問下さい。カスタマイズ方法もOKです！

本館「MY HEALING☆彡」もよろしくお願いします。

NewEntry

Category

NINJA BLOG TBP

Bookmark

☆PR☆

◆何かおいしい話はないかなあ？　ハイここにあります！
◆［無料講座］絶対に社員には教えたくない!
◆ロリポップならMovableType設置マニュアルも充実。
あなたも月々２６３円でブログデビューしてみよう！！
◆読むだけで人生が変わる本「幸せの仮説」

Profile

ＨＮ：

Urara

性別：

女性

アクセス解析

MASTER : WRITE

日々、ニンブロテンプレート＆カスタマイズの研究・製作に励んでいるブログ

2025/02/01 (Sat)

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

2006/08/01 (Tue)

[ツレヅレ]カスタマイズ

ラインの付け方 || 一口メモ

カスタマズと言うよりも小技？

エントリータイトルやブロック周りなどのラインを付けるのにちょっとした、手間を省こう！と言う記事です(笑)

例えば、実線で1pxの黒を付けたい場合。
border:solid 1px #000000; とこんな感じでやってますよね？
では、左右は点線の1px青・上下は実線の2pxの黒と付けたい場合は？
(こんなラインを付ける人はいないと思いますが・・例として)

border-top:solid 2px #000000;
border-bottom:solid 2px #000000;
border-right:dotted 1px #0000FF;
border-left:dotted 1px #0000FF;

↑こんな風にやってますよね？

それを、ひとまとめ？にした方法。

border-width : 2px 1px 2px 1px;
border-style : solid dotted solid dotted;
border-color : #000000 #000000 #000000 #000000;

上・右・下・左の順番となってます。
border-width ←ラインの太さ
border-style ←ラインの種類
border-color ←ラインの色

エントリータイトル

border-width : 0px 0px 1px 7px;
border-style : solid;
border-color : #990000;

エントリータイトル

border-width : 1px;
border-style : solid;
border-color : #FFFFFF #555555 #555555 #FFFFFF;
background:#C1BFBF;
(ちょっと影があるように見える風)

エントリータイトル

border-width : 0px 20px 1px 0px;
border-style : none solid dashed none;
border-color : #660033;
background:#EEEEEE;

こんな感じで色々と組み合わせれば個性的なラインも作れちゃいます＾＾
色々と楽しんでみて下さいネ♪

Trackback() Comment(0)