BloggerでCSSを追加する方法–BloggerでCSSを理解する
でCSSを理解する雪の秋、3Dフォント、ネオンテキスト、ボックスの影のようなあなたのブログにいくつかのクールな効果を追 CSS、それは何ですか? CSSはカスケードスタイルシートとして知られており、ブログのルックアンドフィールを記述するために使用されたり、他の言葉でHTML要素の表示方法を定義 CSSについて学ぶ前に、HTMLについて知っておくことをお勧めします。 CSSにはたくさんのリソースがあり、初心者でもCSSの基本的な要素を簡単に理解することができますが、それを習得するには多くの時間と実践的な知識
CSSは要素を美化する上で最も重要な役割を果たし、デフォルトではすべてのBloggerテンプレートには独自のCSSコードがあります。 いつでもあなたのブログのデザインをさらに美化したい場合は、カスタムCSSを追加することができます。 私たちのブロガーのチュートリアルのいくつかでは、我々はこの記事を見て、例えばCSSコードを追加するために私たちの訪問者を言及しているが、初心者のほ それらのほとんどは、単に彼らのテンプレートファイルを開き、bを見つける:スキンタグといくつかの方法で最終的に彼らのテンプ Bloggerは、あなたのブログのための魅力的な外観を達成するために、デフォルトのCSSコードを上書きするテンプレートデザイナーで独自のカスタムCSSを追加す ここでは、BloggerにCSSを挿入/追加する方法を紹介します。
BloggerにCSSを挿入/追加する方法–BloggerでCSSを理解する
CSSを追加する前に、CSSを記述する必要があり、CSSスタイルコードを記述する前に、スタイルを変更するセ あなたは、要素を検査するためにあなたのブラウザの開発者のツールを利用することができます、ここではそれについての詳細を行っていません。 たとえば、一般的にh1、h2、h3、h4、h5、およびh6タグについて知っていて、これらのフォントを変更するには、以下のようなCSSを追加できます。
h1 {font-family: "Times New Roman", Times, serif;font-size: 15px;font-weight: bold;color: rgb(56, 77, 187)}
しかし、要素クラスがわからないときに、ページレイアウト、メニュータブスタイル、リンク、フォントファミリ、配置、背景またはテキストの色を変更す これは、あなたのブラウザ開発者のツールを利用する必要がある場所です。 要素を右クリックしてから、inspect elementをクリックすると、左側に要素が表示され、右側にCSSが表示されます。 CSSコードを変更して、変更の結果を確認します。たとえば、メニュータブのCSSコードがあり、テンプレートでは異なることがわかります。
.tabs-inner .widget li a:hover {color: #fff;background-color: #FF9900;text-decoration: underline;display: inline-block;padding: .6em 1em;font: normal normal 15px 'Trebuchet MS', Trebuchet, Verdana, sans-serif;border-left: 1px solid #ffffff;border-right: 1px solid #dddddd;}
でカスタムCSSコードを追加するinspect elementツールを使用すると、任意の要素のCSS変更をプレビューでき、目的の外観を取得したときにCSSコードを取得してブログで実行できます。
BloggerでCSSを適用する
BloggerでCSSを実装するには、テンプレートファイルを直接編集する方法と、Blogger template designerでCSSを追加オプションを使用する方法があります。
Blogger template designerを使用してCSSを追加
CSSを追加することは、コアテンプレートファイルに影響を与えないため、最も簡単で安全な方法です。 カスタムCSSを追加する以外に、Blogger template designerを使用すると、簡単に幅、レイアウト、フォントスタイル、色、ガジェット領域、フッターの内容などを調整し、あなたのブロ
- Bloggerブログにログインし、テンプレートに移動し、カスタマイズ
- 今、あなたは5つのいくつかのオプ
- 次に、右側にフィールドが表示され、ここでカスタムCSSを追加する必要があります。
上記のカスタムCSSコードを追加し、以下の変更を参照し、すべてが完了したら、上部の”ブログに適用”をクリックしてください。
Bloggerテンプレートを編集してCSSを追加する
CSSを適用するもう一つの方法は、コアCSSを直接編集するか、テンプレートファイルにカスタムCSSを追加するこ 不適切な使用は、あなたのテンプレートを破るためにつながる可能性があるため、私たちは、初心者のためにこの方法をお勧めしません。 このメソッドを使用してCSSを追加する前に、必ずバックアップしてください; Bloggerテンプレートをバックアップおよび復元する方法は次のとおりです。
- Bloggerダッシュボードで、テンプレートに移動し、HTMLの編集をクリックします
- 今、あなたはあなたのテンプレートコードが表示されます、CTRL+Fを押して検索し、<b:skin>
- <b:skin>を展開すると、あなたのブログテンプレートのCSSが表示されます。
にカスタムCSSコードを挿入します。: Blogger blog
の完全なバックアップを作成する方法既存のCSSの編集を開始するか、カスタムCSSを追加することができますが、ここではBlogger template designerで取得するプレ 完了したら最後にテンプレートを保存します。
この記事がBloggerにCSSを追加するためのガイドを願っています。 あなたのblogを美化し始め、より多くのそのような更新を得るために私達のRSSの供給を予約購読しなさい。
Leave a Reply