TOP / CSS Tester

CSS Tester これはカスケード・スタイル・シートをテストするためのページです。

CSS Testerはカスケード・スタイル・シートをテストするためのページです。あまり重要なものは載せていません。

ヘッダーとパラグラムに差をつけると見やすくなるのかをテストしよう。ヘッダーに罫線を置くと読みやすくなるのかならないのか 調べよう。

現状の問題点

ヘッダー1の文章が長いと文字が被って表示される。

ページ内のコンテンツ情報が多い場合、スクロールして目的の段落を探すのが見づらい。これは、各ヘッダーに罫線を書いたり 色分けをしていないから見づらい

ヘッダーの左スペース

パラグラムとヘッダーのy軸が一緒なので、スクロールしたとき見づらい。ヘッダーをもっと左に寄せるか、パラグラムをもっと 右に寄せたほうがよい。

ヘッダー2

ヘッダー3

ヘッダー4

ヘッダーが見分けやすいか?これも見づらい

リスト表示

リスト表示とパラグラムの統一感を持たせないと見づらくなるので注意

  • HELLO CSS TEST WORLD1
  • HELLO CSS TEST WORLD2
  • HELLO CSS TEST WORLD3

テーブルのテスト

aaaaaaaa
bbああああああほげaa
aaaaaaaa
bbああああああほげaa

ソースコードの表示

これもリスト表示と同様パラグラムとの統一感を持たせないと汚くなる!!!


#ああああああああ
#いいいいいいいい
import hoge.fuga.World;

public clss HelloPreCodeTag {
    public static void main(String [] args) {
        System.out.println("HELLO PRE CODE WORLD");
        /*
         * いろいろテストしてみる
         */

    }
}
// CSS TESTER
    

a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a



イバラキングへのリンク Get Firefox Valid XHTML 1.1 Apple Darwinへのリンク