ドットインストール - 3分動画でマスターできるプログラミング学習サービス
レッスン一覧
プレミアム会員
法人でのご利用
レッスン一覧
プレミアム会員
法人でのご利用
ログイン
運営からのお知らせ
2023/01/26
NEW
週刊ドットインストール(2023/01/26号)を更新しました!
PREMIUM
【旧版】CSS3入門
多彩な表現力でWebサイトの見た目を制御することができるCSS3について学びます。
0%
新しいレッスンがあります
旧版のレッスンは更新を終了しており、現状と異なる場合があります。サポートも終了しておりますので、最新版への移行をお願いします。
PREMIUM
詳解CSS 基本スタイリング編
CSSの基本的なスタイリング手法について学んでいきます。
0%
動画レッスン一覧
(19)
未完了
#01 CSS3とは何か?
(02:43)
無料公開中
主な特徴
必要な知識
必要なツール
レッスンの範囲について
未完了
#02 ベンダープレフィックスとは何か?
(02:54)
無料公開中
CSS3の対応状況
ベンダープレフィックスの説明
ベンダープレフィックスの種類
caniuse.comの使い方
未完了
#03 角丸をつけてみよう
(02:36)
無料公開中
border-radius
未完了
#04 角丸を使ったテクニック
(01:03)
無料公開中
円形の作り方
画像の切り抜き方
未完了
#05 色の指定と透明化
(02:12)
rgba
opacity
未完了
#06 ボックス要素に影をつけてみよう
(02:37)
box-shadow
未完了
#07 テキストに影をつけてみよう
(02:11)
text-shadow
未完了
#08 線形グラデーションをつけてみよう
(02:51)
linear-gradient
未完了
#09 円形グラデーションをつけてみよう
(02:57)
radial-gradient
未完了
#10 要素を変形させてみよう (1)
(02:59)
transform:scale
transform-origin
未完了
#11 要素を変形させてみよう (2)
(01:56)
transform:translate
transform:rotate
transform:skew
未完了
#12 簡単なアニメーションをつけてみよう
(02:56)
transition
未完了
#13 キーフレームでアニメーション (1)
(02:14)
animation
未完了
#14 キーフレームでアニメーション (2)
(02:11)
animation
動作確認
未完了
#15 属性セレクタを使ってみよう
(02:30)
a[href="foo"]
a[href^="foo"]
a[href$="foo"]
a[href*="foo"]
未完了
#16 n番目に来る要素を指定する
(02:52)
nth-child
first-child
last-child
only-child
未完了
#17 ある要素のうち、n番目に来る要素
(02:55)
nth-of-type
first-of-type
last-of-type
only-of-type
未完了
#18 要素の状態で指定するセレクタ
(02:44)
:disabled
:enabled
:checked
未完了
#19 CSS3のジェネレータを見てみよう
(01:55)
http://www.css3maker.com/
http://border-radius.com/
http://css3button.net/
http://www.colorzilla.com/gradient-editor/
ギャラリー
このレッスンについて
最終更新日
2014年12月17日
バージョン情報
CSS3
関連キーワード
(6)
基礎講座
(360)
初心者向け
(359)
HTML
(110)
CSS
(111)
ウェブサイト構築
(155)
CSS3
(20)
このレッスンを共有する