見栄えの良い CSS カスタム スタイル (タイトル h1 h2 h3)

見栄えの良い CSS カスタム スタイル (タイトル h1 h2 h3)

レンダリング

Blog Gardenでよく使われるスタイル

/*タイトル h1 h2 h3 スタイル*/
#コンテンツ {
    色: 黒;
    フォント: 0.875em/1.5em「Microsoft YaHei」、「PTSans」、「Arial」、サンセリフ;
    フォントサイズ: 16px;
}
#コンテンツ h1 {
    背景: #2B6695;
    境界線の半径: 6px 6px 6px 6px;
    ボックスの影: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    色: #FFFFFF;
    フォント ファミリ:"Microsoft YaHei"、"Songti"、"HeiTi"、Arial;
    フォントサイズ: 18px;
    フォントの太さ: 太字;
    高さ: 25px;
    行の高さ: 25px;
    マージン: 18px 0 !重要;
    パディング: 8px 0 5px 5px;
    テキストシャドウ: 2px 2px 3px #222222;
}
#コンテンツ h2 {
    背景: #2B6600;
    境界線の半径: 6px 6px 6px 6px;
    ボックスの影: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    色: #FFFFFF;
    フォント ファミリ:"Microsoft YaHei"、"Songti"、"HeiTi"、Arial;
    フォントサイズ: 15px;
    フォントの太さ: 太字;
    高さ: 24px;
    行の高さ: 23px;
    マージン: 12px 0 !重要;
    パディング: 5px 0 5px 10px;
    テキストシャドウ: 2px 2px 3px #222222;
}
#コンテンツ h3 {
    背景: #5B9600;
    境界線の半径: 6px 6px 6px 6px;
    ボックスの影: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    色: #FFFFFF;
    フォント ファミリ:"Microsoft YaHei"、"Songti"、"HeiTi"、Arial;
    フォントサイズ: 13px;
    フォントの太さ: 太字;
    高さ: 24px;
    行の高さ: 20px;
    マージン: 12px 0 !重要;
    パディング: 5px 0 5px 10px;
    テキストシャドウ: 2px 2px 3px #222222;
}

ボタンスタイル

CS

/*おすすめ/嫌いボタン*/
#div_digg {
    位置:固定;
    下:10px;
    幅:140ピクセル;
    右:390px;
    境界線:2px 実線 #6FA833;
    パディング:10px;
    背景色:#fff;
    境界線の半径:5px 5px 5px 5px !重要;
    ボックスの影:0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
}

上記は、より美しい CSS カスタム スタイル (タイトル h1 h2 h3) の詳細です。CSS カスタム h2 h3 スタイルの詳細については、123WORDPRESS.COM の他の関連記事に注目してください。

<<:  MySQLにインデックスを追加しても効果がないいくつかの状況について簡単に説明します。

>>:  html リンク タグ タイトル属性 改行 マウス ホバー プロンプト コンテンツ 改行効果

推薦する

Vueは単一ファイルコンポーネントの完全なプロセス記録を実装します

目次序文単一ファイルコンポーネント基本概念シンプルなローダーコンポーネントコンテンツの解析コンポーネ...

Vueキャッシュ機能の使い方

目次vue2のキャッシュ機能Vue キャッシュ関数の変換最適化要約するvue2のキャッシュ機能vue...

Vue が scss (mixin) をグローバルに導入

目次1. ミックスイン.scss 2. 単一ファイルの使用3. グローバルマウント3.1 依存関係の...

Linux 環境の Apache で https サービスを有効にする方法の詳細な説明

この記事では、Linux 環境の Apache で https サービスを有効にする方法について説明...

JavaScript を使用して div の位置をドラッグして入れ替える例

1 実施原則これは、DOM 要素の dragstart/ondragover/ondrop イベント...

Zabbix WEB 監視実装プロセス図

Zabbix独自のWEBインターフェースを例に、Web監視の設定を行います。環境: zabbix4....

MySQL設定ファイルを変更できない問題の解決方法(Win10)

他の人のために解決した問題を記録します。問題の説明MySQLのバージョンは5.7、オペレーティングシ...

Vue フロントエンドと Django バックエンドを使用して、一定期間内のデータをクエリする方法

序文開発プロセスでは、すべてのデータではなく特定の期間内のデータをクエリするなど、クエリのフィルタリ...

HTMLウェブページの基本概念の簡単な分析

ウェブページとは何ですか? HTML ドキュメントがブラウザカーネルによってレンダリングされた後に表...

挿入前にレコードが既に存在するかどうかを確認するには、SQL ステートメントを使用します。

目次SQL文を挿入する前にレコードが既に存在するかどうかを確認するSQL挿入時の判断の簡単なコレクシ...

MySQLの行数カウントに関する簡単な説明

各テーブルの行数をカウントするために使用される MySQL count() 関数は、誰もがよく知って...

Javascriptで戦略パターンを実装する方法

目次概要コードの実装要約する概要戦略パターンは、JavaScript デザイン パターンにおける動作...

CSS を使用してサブ要素に応じて異なるスタイルを記述する方法

達成すべき効果: 必要なもの1枚、2枚、3枚とスタイルが異なります。子要素の判定はjsで完結できます...

CentOS 7 で MySQL 5.7 をインストールして設定する

この記事では、以下の環境をテストします。 CentOS 7 64 ビット 最小 MySQL 5.7 ...