スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

カスタマイズtipsもどき。

今までお問い合わせいただいたことをまとめてみたり、その他もちらっとあったり。
詳細は追記に(各リンク先もココの追記です)。

リンク(サイドメニュー「Links」)を別窓表示にする
文字サイズを一括変更する
左右のカラムを入れ替える
<font>タグによる文字サイズ指定、tableのcellpaddingを有効にする
(↑太文字にリンクした場合、太文字指定が解除される場合にも有効です…)
リンク先を別窓表示にする

テンプレートHTMLをちょびっと修正。色変わってる部分を追加します。

<!-- リンク部分ここから -->
<div class="side">
<h2 class="side_title">Links</h2>
<div class="side_body">
<ul>
<!--link-->
<li><a href="<%link_url>" title="<%link_name>" target="_blank"><%link_name></a></li>
<!--/link-->
</ul>
</div>
</div><!-- ※/side※ -->
<!-- リンク部分ここまで -->

プラグインを利用した場合、デフォルトで別窓表示になります。
プラグイン対応方法はこちら。→



文字サイズを一括変更する

CSS「body」のfont-size値をいじります。(「全体の設定」のところです)

body {
   - 省略 -
 font-size: 75%;
}

カレンダー(横一列タイプ・表タイプ両方)は8pt指定なので個別に調整する必要がありますが、
その他の文字サイズはココで一括変更できます。
ちなみにデフォルトは75%。
私の環境では12px・9ptと同サイズに見えるのですが…他のかたにはどう見えるんでしょうか↓
12px9pt、 75%
IEはpx、pt指定だと、ブラウザ側での文字サイズの変更が効きません。
上の12px、9ptの部分はそれぞれpx、pt指定しています。試しにやってみるとサイズが変わらないのが確認できると思います(IEのみ)。
文字サイズはpx、pt指定であっても解像度やモニタサイズ等で見える大きさが違うので、
指定サイズによっては別環境で全然読めなくなってしまう可能性もあります。
なので%指定がいいんじゃないかなと思うのです。ちいさい文字が好きなかたは特に。



左右カラムを入れ替える

テンプレートCSSを修正。「レイアウト用ブロック設定」(CSSの上のほうです)

/* エントリ表示部 */
div#main {
 width: 550px;
 float: left;
}
/* サイドメニュー部分 */
div#menu {
 width: 180px;
 float: right;
}

…これで一応左右逆になります。フッタ部分の表示が気になるかたは、
そちらも適当にいじってください。
左右border及びpaddingをいじる場合は、値指定に注意してくださいね。



<font>タグによる文字サイズ指定、tableのcellpaddingを有効にする

デフォルト状態での不具合:
  • 「<font size="○○">」による文字サイズ指定が効かない
  • tableのcellpaddingが効かない
  • 太文字(<strong>等)にリンクした場合、太文字が解除される
このあたりに有効です。お手数ですが修正をお願いします。
…申し訳ありません;;;。tipsでもなんでもなくてすみません…;;;

修正箇所: CSS
「*」を使って全ての要素に初期化をかけていたのを、必要な部分のみの初期化に変更します。
以下の変更を行うと、
  • 見出し(h1~h6)が、太文字になります(記事内で見出しを使った場合)。
    (これは問題ないのではないかと思うのでスルーします)
  • 表カレンダーの曜日部分が太文字になります。
    (こちらは対応策を後述します)

CSS 「初期化」部分の、

* {
 margin: 0;
 padding: 0;
 border: none;
 font-style: normal;
 font-weight: normal;
 text-decoration: none;
 font-size: 100%;
}

上記箇所を、以下のように修正してください。↓

body, div, p, ul, ol, dl, dd, form {
 margin: 0;
 padding: 0;
}
h1, h2, h3, h4, h5, h6, table {
 margin: 0;
 padding: 0;
 font-size: 100%;
}

表カレンダーの曜日部分が太文字になってしまうのが気になるかたは、
CSSの「メニュー部設定」の「カレンダー設定」の以下の部分に、
色が変わっている1行を付け足してください。

.calendar th {
 font-size: 8pt;
 font-weight: normal;
}

ホントすみません…;;;
スポンサーサイト

Comment

管理者だけに表示を許可する

Trackback

Trackback URL:

http://peacockblue.blog10.fc2.com/tb.php/83-06d26c96
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。