2002年03月08日

  userCSS編

userChrome.css編



userChrome.css やuserContent.css は
多機能エディタか拡張を使って編集できます
編集するための拡張
Config Files Editor
ChromEdit
userChrome.css やuserContent.css の一般的な具体例は以下で
userchrome.css - Firefox まとめサイト
usercontent.css - Firefox まとめサイト
Firefox Help: 便利な使い方
Tips:えむもじら


«1»b2rのサイドバー板一覧のフォルダ左側の+−マークを消す



userChrome.css に以下を追加



/* b2rのサイドバー板一覧のフォルダ左側の+−マークを消す */
#pageMain treechildren::-moz-tree-twisty {
list-style-image: none !important;
width:0px !important;
padding:0px !important;
}


関連で
userChrome.css に以下を追加



/* ブックマークのフォルダ左側にある+−マークを消す */
#bookmarksPanel treechildren::-moz-tree-twisty {
list-style-image: none !important;
width:0px !important;
padding:0px !important;
}

«2»b2rのサイドバーの板一覧に色をつける



userChrome.css に以下を追加



/* b2rのサイドバーの板一覧の奇数行に色をつける */
#treeBbsMenu treechildren:-moz-tree-row(even){
background-color: ○○ !important;
}

/* b2rのサイドバーの板一覧の偶数行に色をつける */
#treeBbsMenu treechildren:-moz-tree-row(odd){
background-color: ○○ !important;
}

/* b2rのサイドバーの板一覧の背景(?)に色をつける */
#treeBbsMenu treechildren {
background-color: ○○ !important;
}


サンプル画像


«3»b2rのステータスバーアイコンを非表示にする



userChrome.css に以下を追加



/* b2rのステータスバーアイコンを非表示にする */
#statusbar-bbs2chreader {
display: none !important;
}

«4»コンテキストメニューからbbs2chreaderを消す



これが必要な人はいないでしょうが一応
userChrome.css に以下を追加



/*コンテキストメニューからbbs2chreaderを消す*/
#context-bbs2chreader {
display: none !important;
}

«5»b2rの書き込み画面の各部分の文字の色や大きさを変える



userChrome.css に以下を追加



/*スレッドタイトル名*/
#lblThreadTitle {
(適当に文字の大きさ、色を指定する)!important;
}
/*名前欄*/
#txtName {
(適当に文字の大きさ、色を指定する)!important;
}
/*メール欄*/
#txtMail {
(適当に文字の大きさ、色を指定する)!important;
}
/*書き込み入力するところ*/
#txtMsg {
(適当に背景色を指定する)!important;
}
/*上の部分を包む部分*/
#wpgForm {
(適当に文字の大きさ、色を指定する)!important;
}
/*書き込み中のメッセージが出る画面*/
#txtResponse {
(適当に文字の大きさ、色を指定する)!important;
}


こんな感じになった
サンプル画像


«6»Foxage2chの文字の大きさを変える



userChrome.css に以下を追加



#foxage2chTree {
(適当に文字の大きさを指定する)!important;
}

«7»bookmarkの文字の大きさを変える



userChrome.css に以下を追加



#bookmarksPanel {
(適当に文字の大きさを指定する)!important;
}

userContent.css編


«1»b2rの書き込み画面の文字を大きくする



userContent.css に以下を追加



/* b2rの書き込み画面の文字を大きくする */
textbox[id="txtmsg"][multiline="true"]{
font-size:○○pt !important;
}

«2»スレッド一覧の一覧部分の文字、背景色を変える



userContent.css に以下を追加



/* b2rのスレッド一覧の文字、背景色を変える */
#treeSubject treechildren{
background-color: ○○ !important;
font-size: ○○pt !important;
color:○○ !important;
}

«3»スレッド一覧画面の一覧部分の偶数行奇数行に色を付ける



userContent.css に以下を追加



/* b2rのスレッド一覧画面の奇数行に色を付ける */
#treeSubject treechildren:-moz-tree-row(even){
background-color: ○○ !important;
}
/* b2rのスレッド一覧画面の偶数行に色を付ける */
#treeSubject treechildren:-moz-tree-row(odd){
background-color: ○○ !important;
}


«4»スレッド一覧画面のその他の各部分の色や大きさを変える



userContent.css に以下を追加



/*タイトルの背景*/
#boxHeader {
(適当に色を指定する)!important;
}

/* 板のタイトル「○○@2ch掲示板」の部分 */
#lblTitle {
(適当に文字の大きさ、色を指定する)!important;
}

/*[bbs2chreader]の部分*/
#lblSubTitle {
(適当に文字の大きさ、色を指定する)!important;
}

/*読み込み動作の何%とかの数字が進む部分*/
#lblStatus {
(適当に文字の大きさ、色を指定する)!important;
}

/*「ブックマークに追加」「更新」の部分*/
.menu-link {
(適当に文字の大きさ、色を指定する)!important;
}

/*「ブックマークに追加」「更新」の間にある縦棒 */
.menu-separator {
(適当に文字の大きさ、色を指定する)!important;
}

/*「ブックマークに追加」「更新」にマウスがのってる時の色を変える*/
.menu-link:hover {
(適当に色を指定する)!important;
}

/*「更新」を押した時の色を変える*/
.menu-link:active {
(適当に色を指定する)!important;
}

/*「!」の部分*/
#colStatus {
(適当に文字の大きさ、色を指定する)!important;


/*「No.」の部分*/
#colNumber {
(適当に文字の大きさ、色を指定する)!important;


/*「タイトル」の部分*/
#colTitle {
(適当に文字の大きさ、色を指定する)!important;


/*「レス数」の部分*/
#colCount {
(適当に文字の大きさ、色を指定する)!important;


/*「未読数」の部分*/
#colRead {
(適当に文字の大きさ、色を指定する)!important;


/*「既読数」の部分*/
#colUnread {
(適当に文字の大きさ、色を指定する)!important;


/*「勢い」の部分*/
#colForce {
(適当に文字の大きさ、色を指定する)!important;


/*「作成日」の部分*/
#colMakeData {
(適当に文字の大きさ、色を指定する)!important;



こんな感じになった
サンプル画像



導入編
FAQ一般編
FAQスキン編
基本改造編
userCSS編
810skin改造編
bookmarklet編
解凍圧縮編



bbs2chreader at 17:07