きまぐれAWA's Life

アクセスカウンタ

zoom RSS CSS(フォント編)ブログのフォントデザインを変えてみる♪

<<   作成日時 : 2008/02/17 01:39   >>

ブログ気持玉 0 / トラックバック 0 / コメント 6

今までのCSS編集でブログ全体ののスタイルの変更をしてきました。
フォント編では各箇所のフォントのデザインに目を向けたいと思います。

現在はデザインテンプレートのデザインが適用されているので、
そのままでもフォントのデザインが崩れることはありません。
今までの変更はデザインテンプレートの上に変更箇所だけ追加した状態で、
CSS編集のみで表示すれば文字の大きさや色が崩れてしまいます。
実際にはデザインテンプレートを使っている限り問題はありません。
でも、『ここのフォントのデザインを少し変えたいな』という場面もあるかも?



さて、フォントのデザインを指定するためには、例えば下のような文字列を使用します。

【フォントの大きさを指定します】
font-size:■%;

【フォントの色を指定します】
color:●;

【フォントの位置を指定します】
position:relative; top:▲px; left:◆px;



これらを使ってフォントのデザインを変えていきますね(はーと)

|ω・)ノシ See you♪

|彡 サッ




■ ブログをいじっちゃおぅ♪ 〜 ブログのレシピ 〜 ■


テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(6件)

内 容 ニックネーム/日時
お久しぶりです(@ぺこ)

ちょっと質問なんですが、
ブログの記事を縦書きなんて
出来るのでしょうか?(@あせ)

出来たら嬉しいなぁと質問させて頂きました(@ぺこ)

ヨロシクお願い致します
たむたむ
2010/12/29 19:36
たむたむさん、いらっしゃいませ(ん)
縦書きにすることは可能ですが、環境によってはうまく表示されない場合があるので注意しないといけないかもです。
例えば、

<div style="writing-mode: tb-rl;">あいうえお
かきくけこ
さしすせそ</div>

こういうスタイル指定のDivタグで記事を書くと縦書きで表示されますが、
IE系のブラウザに限定されます。
他ブラウザだと横書きのままです。

もっとややこしいことをすれば全てのブラウザで見れるようですが、
かなり複雑そうな感じですね。
はやり環境に左右される方法はあまりオススメではないかもですね。
mairis
2010/12/29 21:37
ありがとうございました

私のPCでは縦書きになったので自己満足で行きたいと思います(@だって)
あと、その記事だけのフォントを変えたくて
切磋琢磨してやっと出来ました(@ういんく)

もう一度mairisさんに尋ねようとも思ったのですが
ちょっと頑張ってみました(@ぶーん)

また、何かありましたら
ヨロシクお願い致します(@ぺこ)


たむたむ
2010/12/30 00:05
>> たむたむさん
おつかれさまでした(ん)
フォント変更も頑張られたのですね〜(にや)
また何かありましたらいつでもおこしください☆
mairis
2010/12/31 10:36

始めまして

あの.ブログを書くときの文字なんですけど

どうやったら
可愛いあずき??文字的なのに出来るんでしょうか??

教えてください
杏瑠
2012/02/03 16:31
杏瑠さん、いらっしゃいませ(にこ)
はじめまして、こんにちは。

>可愛いあずき??
こちらはあずきフォントのことでしょうか(ん)?

■あずきフォント■
http://azukifont.com/

あずきフォントと仮定してお話を進めますね。
以下の文字列を変更したい領域のところに記述します。

font-family: "あずきフォント";

例えばブログ全体の文字をあずきフォントに変える場合だったら…

body{font-family: "あずきフォント";}

こんな感じです。

ただフォントを指定する場合、ブログを見てる方のパソコンにCSSで指定したフォントが入っていないとその文字は見れません。
例えば、杏瑠さんにはブログの文字が「あずきフォント」で見えていても、ブログを見てる方のパソコンに「あずきフォント」が入ってなかったらフツーの文字にしか見えないということになりますので注意してください。



mairis
2012/02/04 00:05

コメントする help

ニックネーム
URL(任意)
本 文
  現在の閲覧者数:

* ぱにゃステ *

『ぱにゃステ』 customized by mairis
 
 
ふぉろーみー

CSS(フォント編)ブログのフォントデザインを変えてみる♪ きまぐれAWA's Life/BIGLOBEウェブリブログ
文字サイズ:       閉じる