zuknow learn together

新しい教材を作成

CSS3

カード 60枚 作成者: ジュンペイ (作成日: 2013/11/07)

  • @media

解説面  クリックしてカードを裏返す

アプリをダウンロードして、このコンテンツを学習しよう! AppStore / Google Play

教材の説明:

CSS3の勉強でよくでてくるものをまとめてみました。

公開範囲:

公開

カテゴリ:

  • このエントリーをはてなブックマークに追加
  • 1

    @media

    補足(例文と訳など)

    答え

    • 解像度によってスタイルを変更。ブラウザの解像度を解析してそれにあわせたCSSを呼び出します。

    解説

  • 2

    要素:empty

    補足(例文と訳など)

    答え

    • 空の要素。

    解説

  • 3

    rule-style

    補足(例文と訳など)

    答え

    • カラムの境界線のスタイル

    解説

  • 4

    transition

    補足(例文と訳など)

    答え

    • transitionの一括指定。

    解説

  • 5

    column-count

    補足(例文と訳など)

    答え

    • 段の数を指定

    解説

  • 6

    要素::selection

    補足(例文と訳など)

    答え

    • 選択範囲。ドラッグした選択範囲の表現を変更します。

    解説

  • 7

    要素[属性^="開始文字列"]

    補足(例文と訳など)

    答え

    • 属性のファイル名やリンク先等の、開始文字を特定しスタイルを適用します。

    解説

  • 8

    rule-width

    補足(例文と訳など)

    答え

    • カラムの境界線の幅

    解説

  • 9

    要素:checked

    補足(例文と訳など)

    答え

    • 入力済み要素に適用。

    解説

  • 10

    animation-delay

    補足(例文と訳など)

    答え

    • アニメを遅れて再生する。

    解説

  • 11

    要素::before

    補足(例文と訳など)

    答え

    • 直前に挿入する内容。

    解説

  • 12

    要素:enabled, 要素:disabled

    補足(例文と訳など)

    答え

    • 入力可能・不可能要素に適用。

    解説

  • 13

    animation-duration

    補足(例文と訳など)

    答え

    • アニメを遅れて再生する。

    解説

  • 14

    要素:only-child

    補足(例文と訳など)

    答え

    • 唯一の子要素。

    解説

  • 15

    box-flex

    補足(例文と訳など)

    答え

    • 各ボックスに割り当てる比率。

    解説

  • 16

    resize

    補足(例文と訳など)

    答え

    • コメント欄の幅を調節するか

    解説

  • 17

    transform-origin

    補足(例文と訳など)

    答え

    • ブロックの標準点。

    解説

  • 18

    liner-gradient

    補足(例文と訳など)

    答え

    • 背景グラデーションと角度

    解説

  • 19

    要素:last-child

    補足(例文と訳など)

    答え

    • 親要素内の最後の要素。

    解説

  • 20

    animation-direction

    補足(例文と訳など)

    答え

    • アニメを逆から再生する。

    解説

  • 21

    transition-delay

    補足(例文と訳など)

    答え

    • 変化開始までの時間。

    解説

  • 22

    box-direction

    補足(例文と訳など)

    答え

    • ボックスを逆方向から並べる。

    解説

  • 23

    box-ordinal-group

    補足(例文と訳など)

    答え

    • 並び順をボックスごとに指定。

    解説

  • 24

    box-sizing

    補足(例文と訳など)

    答え

    • 幅指定にボーダーを含むかの指定

    解説

  • 25

    transition-property

    補足(例文と訳など)

    答え

    • ブロックをスムーズに変化する。

    解説

  • 26

    要素:nth-of-type()

    補足(例文と訳など)

    答え

    • 兄弟要素が続く時、一定間隔に適用。

    解説

  • 27

    outline-offset

    補足(例文と訳など)

    答え

    • ボーダーとアウトラインの間

    解説

  • 28

    opacity

    補足(例文と訳など)

    答え

    • 透明度。opacityは、単純に透明化する指定です。

    解説

  • 29

    要素:last-of-type

    補足(例文と訳など)

    答え

    • 最後の要素のみ適用。

    解説

  • 30

    要素:target

    補足(例文と訳など)

    答え

    • ターゲット先の要素を表示。

    解説

  • 31

    animation-timing-function

    補足(例文と訳など)

    答え

    • アニメ速度の変化方法。

    解説

  • 32

    box-shadow

    補足(例文と訳など)

    答え

    • ボックスに影をつける

    解説

  • 33

    animation-duration

    補足(例文と訳など)

    答え

    • アニメを遅れて再生する。

    解説

  • 34

    column-gap

    補足(例文と訳など)

    答え

    • カラムとカラムの間隔

    解説

  • 35

    column-width

    補足(例文と訳など)

    答え

    • 各カラムの横幅を指定

    解説

  • 36

    要素[属性*="含まれる文字列"]

    補足(例文と訳など)

    答え

    • 属性のファイル名やリンク先等の、終了文字を特定しスタイルを適用します。

    解説

  • 37

    box-orient

    補足(例文と訳など)

    答え

    • ボックスの並び指定。

    解説

  • 38

    rgba

    補足(例文と訳など)

    答え

    • RGBと透明度。半透明にしたい時に使うのが理想的です。

    解説

  • 39

    要素:root

    補足(例文と訳など)

    答え

    • htmlに対して適用させる擬似クラス。

    解説

  • 40

    要素:only-of-type

    補足(例文と訳など)

    答え

    • 親要素内の唯一の要素。

    解説

  • 41

    hsla

    補足(例文と訳など)

    答え

    • HSLと透明度。基本的にrgbaと変わりませんが、色相以外の彩度・明度はパーセントで指定する必要があり、その点に置いてはrgbaの方が使いやすいかと思います。

    解説

  • 42

    transition-timing-function

    補足(例文と訳など)

    答え

    • 速度の変化方法。

    解説

  • 43

    column-rule

    補足(例文と訳など)

    答え

    • カラムの一括指定

    解説

  • 44

    box-align

    補足(例文と訳など)

    答え

    • ボックスの縦位置揃え。

    解説

  • 45

    animation-name

    補足(例文と訳など)

    答え

    • アニメーション・キーフレームの名前。

    解説

  • 46

    要素::after

    補足(例文と訳など)

    答え

    • 直後に挿入する内容。

    解説

  • 47

    要素:first-letter

    補足(例文と訳など)

    答え

    • 最初の文字だけスタイルを適用。

    解説

  • 48

    要素:first-line

    補足(例文と訳など)

    答え

    • 最初の行だけスタイルを適用。

    解説

  • 49

    animation

    補足(例文と訳など)

    答え

    • アニメーションの一括指定。

    解説

  • 50

    rule-color

    補足(例文と訳など)

    答え

    • カラムの境界線の色

    解説

  • 51

    要素:first-of-type

    補足(例文と訳など)

    答え

    • 最初の要素のみ適用。

    解説

  • 52

    要素:not

    補足(例文と訳など)

    答え

    • 該当しない要素のスタイル削除。

    解説

  • 53

    background-clip

    補足(例文と訳など)

    答え

    • ボーダーと背景の関係。

    解説

  • 54

    background

    補足(例文と訳など)

    答え

    • 背景の複数指定等。

    解説

  • 55

    要素:nth-last-child()

    補足(例文と訳など)

    答え

    • 同要素が続く時、後から一定間隔に適用。

    解説

  • 56

    要素:nth-child()

    補足(例文と訳など)

    答え

    • 同要素が続く時、一定間隔に適用。

    解説

  • 57

    transform

    補足(例文と訳など)

    答え

    • ブロックの変化

    解説

  • 58

    display

    補足(例文と訳など)

    答え

    • ボックスレイアウト。「display:box」は、floatを使わずボックスを横並びにできる機能です。

    解説

  • 59

    要素[属性&="終了文字列"]

    補足(例文と訳など)

    答え

    • 属性のファイル名やリンク先等の、終了文字を特定しスタイルを適用します。

    解説

  • 60

    box-pack

    補足(例文と訳など)

    答え

    • ボックスの横位置揃え。

    解説

56556

セットの学習コンテンツ

公開初月で
60,000
ダウン
ロード!

無料アプリはこちら!

英単語をウェブサイト
からzuknowに簡単登録

覚えたい単語を選択するだけ!
簡単にzuknowに登録することが
できます

Get the free Chrome Extension

トップ