CSS3 演習問題

CSS3 演習問題　の解答

【問１】CSS3で影をつける場合の、プロパティ名を２つ書きなさい

【答１】box-shadow　text-shadow

※ 答えをクリックすると詳しい内容がわかります。

【問２】CSS3で影をつける場合、プロパティに設定する4つのパラメータ

のうち、1つ目のパラメータは何を設定するか書きなさい

【答２】X軸方向（横方向）のずれの距離

※　参照サイトへ

【問３】CSS3で角を丸くする場合の、プロパティ名を書きなさい

【答３】border-radius

※　参考ページ

【問４】CSS3で角を丸くする場合の、値は何を設定しているかを書きなさい

【答４】角を丸くする円の半径

※　参考ページ

【問５】Chromeとサファリのベンダープレフィックスを書きなさい

【答５】-webkit-

※ -webkit-には、Operaも含まれる。

※ -moz- は Firefox

※ -ms- は  Internet Explorer

こちらを参照

【問６】CSS3で直線的なグラデーションをつける場合の、プロパティを

書きなさい（ベンダープレフィックスは、記述しない）

【答６】background-image: linear-gradient(　) 

※　参考ページ 

【問７】半透明の表現をするには、対象の要素に対してどの関数を設定すれば

よいか書きなさい

【答７】rgba( )

※ a はアルファの意

※　参考ページ

【問８】CSS3で要素を回転したり、拡大縮小したり、歪曲させること設定する

プロパティは何か書きなさい

【答８】transform

※　参考ページ

【問９】Webの通常フォント以外のフォントを使用したい場合、どの

ディレクティブで使用するフォントを定義する必要があるか書きなさい

【答９】@font-face   

【問10 】次のスタイルは、どのような設定か説明しなさい

td:nth-child(n+2) { text-align: right; }

【答10】最初の td をのぞく2番目以降の td のセル内容を右寄せに設定

※　参考ページ

【問11 】次のスタイルは、どのような設定か説明しなさい

tr:nth-of-type(even) { background-color: #F3F3F3; }

【答11】偶数番目のtrの行の背景色をカラーコード#F3F3F3に設定

※ even　は偶数の意

※　参考ページ

【問12 】CSS3で要素を回転して表示する設定を書きなさい

　（ベンダープレフィックスは、記述しない）

【答12】transform: rotate( )

※　参考ページ

【問13 】:first-childセレクタは、どのようにスタイルを設定しているか

書きなさい

【答13】:first-childは最初の子要素のスタイルを指定します

※　参考ページ