今日、私は次のことに困惑しました。HTMLレイアウトデザイナーであると主張する人の知識とスキルを評価するために、質問のリストを考え出すこと。
個人的には、そのようなテストで実際のレベルを評価することは難しいように思えますが、それでも知識に関する一般的なアイデアを提供してくれます。
そのようなダッシュ
1.次のスタイルが指定されています。
<スタイル> .red { 色:緑; } .green { 色:赤; } .red .green { 色:黄色; } #black { 色:黒; } </ style>
クラスがこの方法で適用される場合、テキストは何色になりますか:
<div class = "red green">テキスト</ div>
そしてこの場合:
<div class = "red"> <div class = "green">テキスト</ div> </ div>
そしてこれで:
<div class = "red"> <div class = "green" id = "black">テキスト</ div> </ div>
2.次のスタイルのdivを指定します。
.fl { 幅:200px; 高さ:200px; 境界線:1pxの赤一色; float:左; }
padding-leftが与えられた場合、彼はすべてのブラウザーでどのように振る舞いますか:100px;
そして、マージンが左の場合は?
3.次のクラスが指定されています。
.f1 { 幅:200px; 高さ:200px; 境界線:1pxの赤一色; float:左; 位置:相対; } .f2 { 位置:絶対; 幅:50px; 高さ:50px; border:1px solid#000000; top:0px; 左:0px; }
<div class = "f1"> <div class = "f2"> </ div> </ div>
それはどのように見えますか? なんで?
4.ブロックには次のクラスが定義されています。
.d1 { 幅:200px; 高さ:100px; 境界線:1pxの赤一色; 余白:30ピクセル; } .d2 { 幅:200px; 高さ:100px; 境界線:1pxの赤一色; マージン上部:10px; }
ブロック:
<div class = "d1"> </ div> <div class = "d2"> </ div>
それらの間の距離は何ですか? すべてのブラウザで同じですか? なんで?
5.素材に関する知識の質問-どのブラウザ用に作成するか(IE6、IE7、Opera、Mozilla2、Mozilla3、Safari、Chromeの場合に必要です)。 各ブラウザのいくつかのバグに名前を付けます。
一般の人が質問自体を批判したり、自分で提案したりするのは素晴らしいことです:)