ネットとブログで副収入生活

ポイントサイト、アフィリエイト、アンケート、クラウドソーシングなどネットで出来る小遣い稼ぎを攻略中。相互リンク、相互RSSは常に受け付けています。コメントより気軽にどうぞー。
PR

ブログの行間を調整する方法

行間が無さ過ぎると見辛いので注意しましょう。




行間とは


行と行とのあいだのことですね。
ブログの場合は記事内、コンテンツなどの行間のことを指します。
縦の幅、余白という認識で良いと思います。



調整する方法


文字の感覚が狭すぎて困ってます――という話を良く聞きますが、ブログの場合はテンプレートを編集することで簡単に行間を調整することができます。

まずはテンプレート内(CSS)にある『line-height』という部分を見つけましょう。『Ctrl+F』ですぐに見つかるかと思います。
複数ある場合は記事、プラグインなどで分けて設定していることが多いです。

実際にある例だと、

line-height: 1.2em;
line-height: 120%;


という書き方が多いですね。

数字が行間の値、パーセンテージなどを示しています。
広げたい時は増やせば良いですし、狭めたい時は減らせば良いです。



広げたい場合
『1.2em』→『1.5em』
『120%』→『150%』 など

狭めたい場合
『1.2em』→『1em』
『120%』→『100%』 など


主観で言うと1em、100%などは狭すぎるかと思います。
また、数値を下げすぎると文字が重なるので注意しましょう。




今回はここまで。
ちなみにFc2ブログの場合はプラグイン1、プラグイン2などを別個に調整しないといけない場合があります。




ブログランキング
にほんブログ村 小遣いブログ 初心者のお小遣い稼ぎへ 

ブログに必要!? 記事内に『見出し』を使いたくなったら

今回はCSS(スタイルシート)とHTMLのお話です。
といってもそれぞれの意味を理解する必要はありません。
あくまで『見出し』に利用するというだけのことです。




見出しとは


ブログをよく閲覧する人なら一度は見たことがあるかと思います。
この記事でまさに今使っている『見出しとは』の部分ですね。
真似をして独自に作ろうとする人も、もしかしたらいるかもしれませんね。

ただしブログ内の機能に備わっているかというと実はそうではありません。
見出しはスタイルシートで作成し、それを記事内で命令して出しています。



スタイルシートを編集


『Fc2』『Seesaa』など最近のブログサービスはスタイルシートを簡単に編集できる仕様なので、困ることは特に無いかと思います。
注意点としては分からない部分の編集は避けること、そして何を編集しているのか認識することです。
適当に編集し、その後更新してしまうとブログのテンプレートが変わってしまったり、意図しないデザインになることもありますよ。

今回の場合は見出しなので、テンプレートにもよりますが追加するだけでオッケーなこともありますね。



『見出し』を構成するプログラムの例


<例1>

h(数字) {
font-size: 105%;
padding: .25em 0 .5em .75em;
border-left: 6px solid #999999;
border-bottom: 1px solid #CCCCCC;
}


例1


先程から使っていますが、上記のプログラムでこういった見出しになります。
『font-size: 105%;』の部分が文字サイズです。
ブログ記事では横線は簡単に出せますが、縦線は出せないので地味に便利なテクニックです。『border-left: 6px solid #999999;』の『6px』でサイズ調整ですね。



<例2>

h(数字) {
font-size: 105%;
padding: .5em .75em;
background-color: #f6f6f6;
}


例2


シンプルに色だけ付けました。『#f6f6f6』が色を示す部分ですね。



こういったプログラムをスタイルシートに書き込み更新すれば見出しを構成するプログラムは完成です。
記事に出力させるプログラムを記述すれば好きな場所に見出しを入れることができます。
(数字)の部分は任意で構いませんが、優先順位を気にする人もいるようです。Googleはそういったことは気にしないと回答しているんですけどね。

h1ならh1、h2ならh2を呼び出しましょう。




オススメの見出しサンプルサイト


管理人が愛用している見出しのサンプルサイトです。

シンプルなHTMLとCSSコピペで実装できるタイトル(見出し)のデザインサンプル 50

こちらをさらに編集して好みにアレンジしています。
若干の知識はいりますが、説明文もあるので初心者でも何とか理解できるかと思います。




ブログランキング
にほんブログ村 小遣いブログ 初心者のお小遣い稼ぎへ 
最近の記事
参加中ランキング
にほんブログ村 小遣いブログ 初心者のお小遣い稼ぎへ


クリック有難うございます。
励みになっています。
リンク
RSS
お小遣いサイト

クラウドワークス
サグーワークス【オススメ】
CROWD【オススメ】

ポイントサイト
げん玉【オススメ】
ネットマイル【オススメ】
ちょびリッチ【オススメ】
GetMoney!【オススメ】
モッピー【オススメ】
お財布.com
ECナビ
POINT PAY
PointShop
PONEY!
ポイントボックス
warau.jp
予想ネット
e-bet
チャンスイット
ハピタス【オススメ】
フルーツメール

アンケートサイト
マクロミル【オススメ】
リサーチパネル
キューモニター

アフィリエイト
忍者AdMax【オススメ】
リンクシェア
アクセストレード

ポイント交換サイト
PeX

プロフィール

ナツキ

Author:ナツキ
ネットで稼ぐ方法を模索し、その中で活用しているところだけ紹介してます。
閲覧した人が得して自分も得する。そんなブログを目指します。


リンクはフリーです。
相互リンクはコメントからお願いします(詳しくはこちら
相互RSSも大歓迎。


サイト開設日:2008.6.1

ツイッター
ブログ内検索