Sunday, November 02, 2008

SlmameのiPhone用レイアウト はてなブックマーク

やってるうちに面倒になって放置してたのですが、とりあえず片付けておこうと思い、作ってみました。
左カラム及び右カラムを非表示にして、本文とエントリタイトルの文字サイズを2倍、及び画面一杯に横幅を広げてあります。

実質最新エントリーから順番に読んでいくスタイルになりますが、過去エントリはgoogleなどで検索という感じでもとくに支障はないはずです。

iphone専用のCSS指定には、他のサーバから呼び出す方法が一番楽だと思います。



CSSのhtmlヘッダ内での指定は
<link media="only screen and (max-device-width: 480px)" href="CSSファイル" type=text/css rel=stylesheet>

となります。

以下、必要なCSSの指定です。元のCSS内容に以下を書き足すあるいは部分を書き換える感じでつかってください。

.blog{
  width:100%;
}

#links{
  display:none;
}

#links2{
  display:none;
}

#content{
  width:100%;
}

#container{
  width:100%;
  text-align:left;
}

.title{
  -webkit-text-size-adjust:200%;
}

.main{
  -webkit-text-size-adjust:200%;
}

0 コメント: