SSブログ

<pre>タグのスタイル

現在このブログは“ブラック”というスキン(デザイン)を適用してるんやけど、このスキンで本文に<pre>タグを使うと、<pre>タグ内のテキストがとても読みづらくなってしまう。

こんな感じ。読めます?


で、スタイルシート(http://blog.so-net.ne.jp/_skin/system/4/style.css)を見てみると、どうも色の指定がおかしい。

.articles{
width: 540px;
color: #cccccc;
font-family: Geneva,Verdana,sans-serif;
font-size: small;
line-height: 166%;
clear:both;
overflow: hidden;
}


pre {
background-color: #e3e3e3;
margin: 12px;
padding: 6px;
font-size: small;
font-family: Geneva,Verdana,sans-serif;
}


本文部分(クラス“ articles”)の文字色が“#cccccc”と指定されているにも関わらず、<pre>タグ内の背景色が“#e3e3e3”と、文字色よりも若干だけ明るく指定されているので、<pre>タグ内のテキストが背景とほとんど同化してしまって、とても読みづらい。

これを読みやすくするには、<pre>タグの文字色(color)に暗めの色を追加設定してやれば済むんやけど、So-net blogはユーザーがCSSを編集することができないので、So-netに修正してもらうしかない。

これって不具合やんな?ってことで、不具合報告しておこう。

あ、あとついでに、<pre>タグのfont-familyは“monospace”にしておいて欲しいかな。


スタイルシート スタンダード・デザインガイド―SEO/ユーザビリティ/アクセシビリティを考慮した実践的HTML&CSSデザイン術

スタイルシート スタンダード・デザインガイド―SEO/ユーザビリティ/アクセシビリティを考慮した実践的HTML&CSSデザイン術

  • 作者: エ・ビスコム・テック・ラボ
  • 出版社/メーカー: 毎日コミュニケーションズ
  • 発売日: 2004/06
  • メディア: 単行本



タグ:
nice!(0)  コメント(0)  トラックバック(0) 
共通テーマ:blog

nice! 0

コメント 0

コメントを書く

お名前:
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

トラックバック 0

トラックバックの受付は締め切りました

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。