見出し画像

【Web制作】プログラミング効率化!チートシートまとめ

ショートカットキー忘れた!あのプロパティ名が思い出せない・・・などなど
ふとした時にチートシートを見て救われたり。
こんなのがあるんだ!っていう発見もあるかも。

そんな時、日本語版の方が見やすいかな?と思ったので、
日本語版のものを集めてみました!(&英語でもわかりやすいもの)

PCに保存したり、1枚印刷して手元に置いておくと便利です。

HTML

画像1

HTML5のタグと概要の説明が載っています。
チートシートがあると検索する手間が省けますね。

https://www.atmarkit.co.jp/fdotnet/chushin/cheatsheet_02/cheatsheet_02_01.html

CSS


Flexboxのチートシート

画像2

→日本語対応!CSS Flexboxのチートシートを作ったので配布します | Webクリエイターボックス

flexboxのチートシートといえば、Webクリエイターボックス様。

わかりやすく日本語化されていて、これ一つでOKかも。

CSSセレクタのチートシート|webliker

画像3

→CSSセレクタのチートシート|webliker

いつもお世話になっているwebliker様のセレクタチートシート

図解+コピペ可なので、理解を深めるのに最適かも。


CSS Alignment Cheatsheet

画像5

→CSS Alignment Cheatsheet

コンテナの要素を揃えるテクニックをまとめたチートシートです。

要素を揃えるのに困ったら、とりあえずこれをみる。

CSS Grid Cheatshee

画像6

→[CSS Grid Cheatsheet]

CSSGridについて簡潔にまとめられています。コピペ可能

Sass Cheat Sheet

画像7

→Sass Cheat Sheet

javascript


Asynchronous JavaScript cheatsheet

画像8

→Asynchronous JavaScript cheatsheet

jQuery cheatsheet

画像9

→jQuery cheatsheet

この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?