Ameblo新テンプレの CSSタグ1~2…全体とヘッダー

新デザインの「CSS編集用デザイン」で提供されるカスタマイズ用CSSのタグ一覧。
この記事は「基本スタイル」と「ヘッダースタイル」の解説です。
青文字が解説部分。

 

*/
/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*

(1)基本のスタイル

*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* (1-1) 基本テキスト全体
——————————————–*/
/* 地色テキスト */
/* 全体の文字色 */
html {
color: #333333;
}

/* リンク */
/* リンク文字の色 */
a {
color: #3970B5;
}

/* 訪問済みリンク */
/* 訪問済みのリンク文字色 */
a:visited {
color: #a27ea2;
}

/* 淡色テキスト */
/* 不明。コメントとか? */
.skin-textQuiet {
color: #999999;
}

/* 強調色テキスト */
/* 不明。コメントとか? */
.skin-textLoud {
color: #ff3399;
}

/* (1-2) 基本背景
——————————————–*/
/* コンテンツ背景、ヘッダー以下の背景色 */
/* コンテンツエリアの背景。ナビの下〜フッターの上まで。*/
.skin-blogBody, .skin-blogBodyInner {
background-color: #ffffff;
}

/* 淡色背景, 自分のコメントエリアの背景色 */
/* コメントエリア */
.skin-bgQuiet {
background-color: #f7f7f7;
}
/* (1-3) 基本境界線
コメント?
——————————————–*/
/* 境界線(強) */
.skin-borderLoud {
border-color: #cccccc;
}

/* 境界線(弱) */
.skin-borderQuiet {
border-color: #e5e5e5;
}

/*
*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*

(2)ヘッダーエリアのスタイル

*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*:::*
*/
/* (2-1) ヘッダー背景
——————————————–*/
/* ヘッダー背景 */
/* ヘッダーの背景色。幅はブラウザ幅と同一。
この中に”[amb-layout=”headerInner]”が入れ子になっており、こちらが幅1120px。 */

.skin-bgHeader {
background-color: #ffffff;
}

/* (2-2) ヘッダータイトル、説明文
——————————————–*/
/* ブログタイトルエリア、ヘッダー画像の下にテキストを隠す */
/* 不明。
現時点では、htmlの中にこの名称のタグが見つからず。 */

.skin-blogTitle {
z-index: -1;
}

/* ブログタイトル */
/* アメブロのタイトル文字。
管理画面の基本設定の「タイトル」。*/

.skin-blogMainTitle {
color: #333333;
margin-bottom: 10px;
font-size: 27px;
}

/* ブログ説明文 */
/* アメブロの説明文字。
管理画面の基本設定の「説明」。*/
.skin-blogSubTitle {
color: #999999;
font-size: 16px;
}

/* ヘッダータイトル */
/* ブログタイトルと説明文文字の囲み枠。 */
.skin-headerTitle {
padding-top: 80px;
padding-bottom: 80px;
text-align: center;
}

コメントを残す

メールアドレスが公開されることはありません。