2010年04月06日

Seesaaブログ iPhone CSS改造1

このブログをiPhoneで見ると、他のSeesaaブログとは表示が違うと思います。

通常
IMG_6807(3).jpgIMG_6807(2).jpg

このブログ(黒板風です)
IMG_6807.jpgIMG_5249.jpg



SeesaaブログはiPhone対応してていいのですが、何かフォントやレイアウトがイマイチ気に入らないのでCSS(カスケードスタイルシート)とやらを改造してみました。

改造するにはPCからSeesaaにログインし、デザイン→iPhoneで改造したいテーマをクリックしてCSSを表示します。
テーマ名は「glay改」などに変えておくといいでしょう。

そこで、「トップ」「記事」のそれぞれのCSSを改造します。
手っ取り早くフォントだけ変えたいなら、

body {
background-color:#CCCCCC;
margin: 0;
}

この部分に

body {
background-color:#CCCCCC;
margin: 0;
font-family: HiraKakuProN-W6;
font-size: 80%;

}

と追加します。フォントの大きさはパーセンテージで調整できます。

またフォントを
HiraKakuProN-W6; から
HiraKakuProN-W3; に変えるともう少しすっきりしたフォントになります。

iPhoneで使えるフォントはこちらに一覧があります。




編集したCSSです。
この様なスタイルになります。
IMG_0073.jpgIMG_3658.jpg

不要な部分を削除し、すっきりとしました。
ソースの説明コメントも付けてあります。
気に入られた方は使ってみてください^^
(Seesaaのキーワードマッチ機能のせいでソースにゴミが入っていました;^^ 修正済)
まずはトップ部分のCSS


次に記事部分のCSSです




その他CSS
黒板風CSS オススメ!
茶系CSS オススメ!
牡丹CSS
和柄CSS
梅CSS
プラットホームCSS


関連リンク
【Seesaa ブログ】iPhone/iPod touch対応(β)のデザイン編集が可能になりました
【Seesaa ブログ】iPhone/iPod touch対応(β)開始しました


posted by anarchy0929 at 05:11| Comment(2) | TrackBack(0) | iPhone CSS | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
フォント変更参考にさせていただきました〜♪
Posted by こども局長 at 2010年04月08日 01:13
大変参考になりました!感謝しています。これからもがんばってください。
Posted by 通販商人 at 2011年02月08日 21:53
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。