実務でよく使うhtml,css,jsの小技をつらつらと紹介します。
※2/11のスクーの授業中で使った資料です。
https://schoo.jp/class/1776
【オシャレCSS編】
1. transformを使って要素を変形させるワザ
2. transitionを使い、CSSだけで簡単なアニメーションを行うワザ 3. keyframesを使ってCSSだけで複雑なアニメーションを行うワザ 4. 矢印アイコンをcssだけで表現するワザ
5. アイコンをアニメーションさせるワザ
6. CSSプロパティ”filter”で画像を加工するワザ
【地味だけど使えるワザ編】
7. 今どきの、要素を上下中央寄せにするワザ 8.「flexbox」で要素を自由自在に整列させるワザ
9. Windowsでwebfontをちょっとマシに見せるワザ
10. アイコンとテキストが1pxズレてる...!とかいうときに5秒で揃えるワザ 11. text-indent:-9999pxの上位互換的なワザ
12. デバイズごとに快適な閲覧をしてもらうために設定すべきviewportのワザ
【jsで無理やりごにょごにょ編】
13. select要素をデザインするワザ
14. input[type=“file”]要素をデザインするワザ
15. ユーザーエージェントを利用してブラウザ&OSハックするワザ