記事の各種調整

★　記事の各種調整



◆　記事の枠


①　枠を消す（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の枠を消す（記事タイトル部を除く）　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

border:none;

}

②　枠をつける（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の枠を設定（記事タイトル部を除く）　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

border-top   :5px solid #ff00ff;/* 上 */

border-right :5px solid #ffff00;/* 右 */

border-bottom:5px solid #0000ff;/* 下 */

border-left  :5px solid #00ffff;/* 左 */

}

③　枠を消す（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の枠を消す（記事タイトル部を含む）　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

border:none;

}

④　枠をつける（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の枠を設定（記事タイトル部を含む）　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

border-top   :5px solid #ff00ff;/* 上 */

border-right :5px solid #ffff00;/* 右 */

border-bottom:5px solid #0000ff;/* 下 */

border-left  :5px solid #00ffff;/* 左 */

}

◆　記事の背景色


①　背景色（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の背景色（記事タイトル部を除く）　　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

background-color:#ffff00;

}

②　背景色（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の背景色（記事タイトル部を含む）　　　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

background-color:#ffff00;

}

◆　記事の文字・画像の中央寄せ


①　文字・画像の中央寄せ（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の文字・画像を中央寄せ（記事タイトル部を除く）　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

text-align:center;/* center→中央　left→左　right→右 */

}

②　文字・画像の中央寄せ（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の文字・画像を中央寄せ（記事タイトル部を含む）　　　*/

/* ------------------------------------------------------- */

.skinArticle{

text-align:center;/* center→中央　left→左　right→右 */

}

◆　記事の文字の色・大きさ・太さ


①　文字の文字の色・大きさ・太さ（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の文字の色・大きさ・太さ（記事タイトル部を除く）　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

color:#00ffff;/* 色 */

font-size:10px;/* 大きさ */

font-weight:bold;/* bold→太い文字 normal→普通 */

}

②　文字の文字の色・大きさ・太さ（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の文字の色・大きさ・太さ（記事タイトル部を含む）　　*/

/* ------------------------------------------------------- */

.skinArticle{

color:#00ffff;/* 色 */

font-size:10px;/* 大きさ */

font-weight:bold;/* bold→太い文字 normal→普通 */

}

◆　記事の背景画像設定


　①　画像を繰り返しない（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の背景画像設定（記事タイトル部を除く）　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

background-image:url(画像のＵＲＬ);

background-repeat:no-repeat;/* 繰り返ししない */

background-position:center top;/* 位置 */

}

　②　画像を繰り返しする（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事の背景画像設定（記事タイトル部を除く）　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

background-image:url(画像のＵＲＬ);

background-repeat:repeat;/* 繰り返しする */

background-position:left top;/* 位置 */

}

　③　画像を繰り返しない（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の背景画像設定（記事タイトル部を含む）　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

background-image:url(画像のＵＲＬ);

background-repeat:no-repeat;/* 繰り返ししない */

background-position:center top;/* 位置 */

}

　④　画像を繰り返しする（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事の背景画像設定（記事タイトル部を含む）　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

background-image:url(画像のＵＲＬ);

background-repeat:repeat;/* 繰り返しする */

background-position:left top;/* 位置 */

}

◆　記事のスクロール（下記では max-height を使っていますが、height でもOKです）


　①　スクロールバーをつける(指定した高さを超えた場合)
　　　（記事タイトル部を除く）

/* ------------------------------------------------------- */

/* 記事のスクロール（記事タイトル部を除く）　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticleBody{

max-height:200px;/* 高さ */

overflow:auto;

}

　②　スクロールバーをつける(指定した高さを超えた場合)
　　　（記事タイトル部を含む）

/* ------------------------------------------------------- */

/* 記事のスクロール（記事タイトル部を含む）　　　　　　　　*/

/* ------------------------------------------------------- */

.skinArticle{

max-height:200px;/* 高さ */

overflow:auto;

}

③　スクロールバーをつける(指定した高さを超えた場合)
　　　（記事タイトル・テーマ部分を除く・・・記事部分のみスクロール）

/* ------------------------------------------------------- */

/* 記事のスクロール（記事タイトル・テーマ部を除く）　　　　*/

/* ------------------------------------------------------- */

.articleText{

max-height:200px;/* 高さ */

overflow:auto;

}

④　記事全体にスクロールバーを付ける

/* ------------------------------------------------------- */

/* 記事のスクロール（記事全体（コメントも含む) 　　　　　　*/

/* ------------------------------------------------------- */

.skinMainArea{

max-height:600px;/* 高さ */

overflow:auto;

}