CSSのグリッドレイアウトで、YouTube風画面レイアウトを作ろう - HTML/CSS入門講座

CSSのグリッドレイアウトで、YouTube風画面レイアウトを作ろう - HTML/CSS入門講座

10 Просмотров

フルバージョンはメンバー限定動画で(月額990円ですべての動画が見放題)
https://youtu.be/7ovMIiOxZoc

プログラミングに関する豆知識やテクニックをご紹介しています。チャンネル登録はこちらから
https://www.youtube.com/user/tomostajp/?sub_confirmation=1

Twitterはこちら
https://twitter.com/seltzer

■ 目次
00:00 スタート
01:06 HTMLを準備しよう
04:26 CSSを準備しよう
07:31 CSS Gridで横並びにしよう
12:48 メイン画面をレイアウトしよう
18:55 メディアクエリーで画面サイズに合わせたCSSを書こう
24:24 ビューポートについて理解しよう

↓ メンバー限定フル動画ではこちらも解説 ↓
28:34 グリッドレイアウトについて詳しく知ろう
33:05 grid-template-rowsで高さを設定しよう
34:43 grid-auto-rows, grid-auto-columnsで標準の値を設定しよう
35:43 repeat関数で繰り返し指定しよう
36:43 frという単位について
39:32 位置合わせの各プロパティ
42:48 grid-column, grid-rowでセルの結合をしよう
47:49 grid-area, grid-template-areasでエリア設定をしよう
53:17 グリッドレイアウトの入れ子と、サブグリッド

■ Udemyで各種入門講座を販売中
PHP 7/8マスター講座
https://www.udemy.com/course/php-master/?referralCode=397F9F422F1A5A30E155

WordPress開発マスター講座
https://www.udemy.com/course/wordpress_master/?referralCode=0F25EA7ADADE55D90BCE

[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門
https://www.udemy.com/course/html-css-js/?referralCode=4B62CC6838D26E1AC5DA

PHP+MySQL(MariaDB) Webサーバーサイドプログラミング入門
https://www.udemy.com/course/php7basic/?referralCode=40B4412347A37B96D388

SQL入門 - MySQLで学ぶデータベース
https://www.udemy.com/course/sql-basic/?referralCode=726C6CD4BD0CBA6D6A9D

Git入門: ノンプログラマーのための Git
https://www.udemy.com/course/git-beginning/?referralCode=399F85EAA147C329749D

kintoneで学ぶ、Webデータベース管理入門
https://www.udemy.com/course/kintone_basic/?referralCode=F52DE5020480810A2D0A

■ 書籍
マンガでざっくり学ぶプログラミング
https://amzn.to/2MXyUH8

よくわかるPHPの教科書 【PHP7対応版】
https://amzn.to/35zg8Ad

【お仕事のお問い合わせ】
https://funmake.net/promotion/
[email protected] たにぐち まこと宛
Ссылки и html тэги не поддерживаются


Комментарии: