半夜かけてようやくブログのスタイルを大体完成させることができました。 コードをコピー コードは次のとおりです。<div id="myFooter" style="position: fixed; bottom: 0px; width: 100%; height: 85px; background: none repeat scroll 0px 0px rgb(0, 120, 216);"> <p id="myFootText">知識は運命を変え、プログラマーは命を救う</p> <p id="myFootCopy">オーマイガール@2014</p> </div> 2. 同時に、記事の下部にある迷惑なプロモーションリンクや広告バナーが削除されます。見た目がずっときれいになりました。CSS コードは次のとおりです。 コードをコピー コードは次のとおりです。/* 宣伝する */ #site_nav_under、#ad_under_post_holder、#under_post_news、#google_ad_c2、#under_post_kb{ 幅:0; 高さ:0; 表示:なし; オーバーフロー:非表示; } 3. 記事の下部にあるコメント ボタンの位置とサイズがかなり不自然です。左寄りすぎていて、クリック可能な領域が小さすぎます。以下は一緒に投稿されています: コードをコピー コードは次のとおりです。#最近のコメントブロック li { マージン: 0; 幅: 275px; } #最近のコメントブロック li.recent_comment_body { 境界線の半径: 0; マージン: 0; } #最近のコメントブロック li.recent_comment_title { 境界線の半径: 5px 5px 0 0; マージン: 3px 0 0; } #最近のコメントブロック li.recent_comment_author { 境界線の半径: 0 0 5px 5px; マージン: 0; } .desc_img{ 幅:75px; 最大幅:75px; } #ブログカレンダー{ 背景:白; } /* コメント */ div.コメントフォーム{ 下マージン:100px; } #コメントフォームタイトル{ 背景: url("<a href="http://static.cnblogs.com/images/icon_addcomment.gif">http://static.cnblogs.com/images/icon_addcomment.gif</a>") 繰り返しなし スクロール 0 2px; 色: #0078d8; フォントサイズ:14px; } div.commentform p{ 下マージン:10px; } .comment_btn { 高さ: 35px; 幅: 90ピクセル; 背景: なし 繰り返しスクロール 0 0 #0078d8; 境界: 0 なし; 境界線の半径: 5px; 色: 白; カーソル:ポインタ; } .comment_btn:hover{ 背景:#317ef3; } #コメントボックスオプション、#コメントボックスオプション + p { テキスト配置:中央; } #tbコメント本文{ 幅:100%; サイズ変更:なし; } #tbコメント作成者、#tbコメント本文{ 境界線:1px実線 #0078d8; } #tbコメント本文:hover{ 境界線:1px 実線 #fca021; } #コメント > h3 { 背景: なし 繰り返しスクロール 0 0 #0078d8; 境界線の半径: 3px; 色: 白; パディング: 8px; 境界線:0 なし; フォントサイズ:14px; } #コメント{ フォントサイズ: 13px; } #コメント h4{ 上マージン:10px; } #コメント h4 span { 色: #6c6351; フォントサイズ: 12px; } .コメントアクション{ 下境界線: 1px 破線 #0078d8; 表示: ブロック; パディング下部: 10px; } .blog_comment_body { 色: #111; フォントサイズ: 13px; 下マージン: 10px; 上マージン: 10px; } #コメント_nav { フォントサイズ: 14px; 上マージン: 10px; テキスト配置: 右; } 最後に、ブログテーマの CSS コードは次のとおりです。 コードをコピー コードは次のとおりです。/* ヘッダー */ #ヘッダ{ 境界線:1px 実線 #044e97; 背景:#0078d8 繰り返し; ボックスシャドウ:0 0 5px; } h1{ 背景: なし; border-bottom:0 なし; } #主要{ 上マージン:5px; 右境界線:0 なし; 最小高さ:1040px; } #ヘッダー1_ヘッダータイトル{ 色:白; フォントの太さ:太字; フォントサイズ:24px; テキストシャドウ:1px 5px 1px #000; } #Header1_HeaderTitle:hover{ カラー:#fca021; } #タグライン{ 色:白; } p.日付{ 背景: なし 繰り返しスクロール 0 0 #0078d8; 下境界線: 1px 実線 #aaa; 境界線の半径: 5px; 色: 白; フォントサイズ: 14px; フォントの太さ: 太字; マージン: 10px 10px 0 50px; パディング: 10px; } .postFoot、p.postFoot{ パディング下部:2px; ボーダー下部:1px 実線 #0078d8; } .postTitle{ パディング:5px 0; } .postTitle a{ フォントサイズ:15px; パディング:2px 0; } .post h2{ 下境界線: 1px 破線 #0078d8; フォントサイズ: 1em; 上マージン: 10px; パディング: 0 0 10px; } .c_b_p_desc_readmore:hover{ カラー:#faa123; } #cb_post_title_url{ フォントサイズ:18px; } #私の署名{ 境界線: 1px 破線 #0078d8; 表示: ブロック; パディング: 5px; } #グリーンチャンネル{ 境界線: 1px 破線 #0078d8; } /* 右メニュー */ #右メニュー{ 境界線:1px実線 #0078d8; 背景:#0078d8; 境界線の半径:10px; } #右メニュー ul{ 背景:白; } #右メニュー li{ 背景: なし 繰り返しスクロール 0 0 #3385ff; 境界線: 1px 実線 #3385ff; 境界線の半径: 5px; 色: 白; マージン: 10px; パディング: 5px; 幅: 150ピクセル; } #右メニュー li a{ 色:白; パディング左:10px; } #右メニュー li:hover{ 背景:#317ef3; } #右メニュー h3{ 色:白; パディング:2px 0 5px 10px; フォントサイズ:18px; 境界線:0 なし; } #ブログカレンダー{ 背景:白; } div.コメントフォーム{ 下マージン:100px; } /* 宣伝する */ #site_nav_under、#ad_under_post_holder、#under_post_news、#google_ad_c2、#under_post_kb{ 幅:0; 高さ:0; 表示:なし; オーバーフロー:非表示; } /* カレンダー */ .カル{ 境界線:0 なし; 幅:100%; 高さ:200px; フォントサイズ:14px; } .CalTitle{ フォントサイズ:15px; } .CalTodayDay{ 背景:#0078d8; } .CalTodayDay au{ カラー:#fc6700; テキスト装飾:なし; } |
<<: Vueコンポーネントの7つの通信方法についての深い理解
1 はじめにApache Storm は、Hadoop と同様に、大量のデータを処理するために使用で...
目次序文子コンポーネントは親コンポーネントにデータを渡す1. 親コンポーネントから子コンポーネントに...
この記事では、MySQL Workbenchのインストールと設定のチュートリアルを参考までに紹介しま...
1.1 ディレクトリ構造の構築この操作は、nginx+mysql+tomcat+dbのディレクトリ構...
フロントエンドとバックエンドを完全に分離する場合、Vue プロジェクトでトークン検証を実装する一般的...
クロージャは、純粋関数型プログラミング言語の伝統的な機能の 1 つです。クロージャをコア言語構造の不...
この記事では、Vueを使用してショッピングカートの数量を変更する方法を紹介します。具体的な内容は次の...
目次1. 繰り返し宣言1.1 変数1.2 しましょう1.3 定数2. 可変プロモーション2.1 変数...
JavaScript での HTML (選択オプション) の詳細な説明1. 基本的な理解:コードをコ...
シナリオ会社のプロジェクトはDockerでデプロイされています。原因不明ですが、コンテナが時々停止し...
0. はじめにibdata1 ファイルとは何ですか? ibdata1 は、innodb システム テ...
WIN10 64ビットに最新のMySQL8.0.18をインストールダウンロード公式サイトから最新バ...
目次1. Vueにおけるwatchの役割はその名の通り、監視の役割です。 2. このオブジェクトのプ...
テーブル ヘッダーでは、明るい境界線の色を個別に定義できます。基本的な構文<TH ボーダーカラ...
スロットとは何ですか? Vue では、子コンポーネント タグの中央に何もラップできないことはわかって...