備忘録の使い方はこちら

HTML

CSS

フォームのベストプラクティス

2022.02.25 2022.03.10 衣笠
CSSHTML
CSS

サイトに動きをつける時に役立つ逆引きリスト

サイトに動きをつけるときに、役立つウェブサイトを見つけました。動かしたいパーツごとにまとめてくれているのでとても便利です。サイトURL
2021.02.22 管理者
CSSHTML
CSS

WEB制作のあれどうやってつくるの？をレシピのように探せるサイト

タイトルの通り、web制作でのあれどうやってつくるの？という疑問を解決してくれるサイト「CODE KITCHEN」を紹介します。このサイトは、あのサルワカを運営している'CatNoseさん'が制作されています。サイトの内容はこれからどんどん...
2021.01.18 管理者
CSSHTML
CSS

Brackets 便利なショートカット

Ctrl + /コメントアウトAlt + ←または→行の先頭または末尾へ移動Ctrl + L行一括選択Ctrl + B （Bを繰り返えせば、同じ文字列を見つけて選択を繰り返します。）選択範囲と同じ文字列を複数選択する文字だけを見たら便利さは...
2020.06.08 2021.01.13 衣笠
CSSHTML
CSS

CSS Gridについて

CSSでレイアウトを組むときに普段ならFlexboxで組むことが多いと思います。CSS Gridとは、Flexboxと同じレイアウトのテクノロジーのことです。CSS GridとFlexboxは表面的には似ています。しかし、それぞれ異なるレイ...
2020.06.09 管理者
CSSHTML
HTML

dl/dt/ddの使い方

意味HTML4までは定義リストとしての意味で使うものだったが、HTML5より説明リストタグとしての意味を持つようになり用途の幅が広がってるらしい。定義リストとは定義リストとは定義に対しての説明なので簡単に言えば辞書のような書き方ぞう：鼻が長...
2020.05.25 衣笠
HTML
CSS

Blackets　おすすめプラグイン

ほぼ必須レベルAutoprefixercss保存時に自動的にベンダープレフィックスが追記される。Beautify見づらいコードが一発で見やすくなります。インストール後、編集メニューの「保存時にBeautifyする」にチェックを入れれば、ファ...
2020.05.22 衣笠
CSSHTML
HTML

div要素とsection要素の使い分け

見出しや文章など意味のあるコンテンツを囲う場合はsection要素、レイアウトを組むためなど、コンテンツがない場合はdiv要素で囲っていこう。左右どちらもひとつのコンテンツのみの場合は section 要素を使って横並びにしてOK。メインカ...
2020.04.10 衣笠
HTML
CSS

Flexboxを使った際、画像が伸びるのを解消する方法

Flexboxを使った際、子要素に画像を入れると縦横比を無視して、縦に伸びてしまう場合の解消方法（ローカルのプレビューでは確認できないが、サーバーにアップしたら伸びる事がある）display: flex;align-items: flex-...
2020.04.07 衣笠
CSSHTML
CSS

Flexboxのベンダープレフィックスが簡単にコピペできて便利

Flexboxを使った際、ベンダープレフィックスが覚えられないので、下記サイトならコピペできて便利。
2020.04.06 衣笠
CSSHTML