VS Code:ライブリロード機能を備えた簡易ローカルサーバーを起動できる拡張機能「Live Server」

Read Article

VS Code:ライブリロード機能を備えた簡易ローカルサーバーを起動できる拡張機能「Live Server」

VS Codeで簡易ローカルサーバーを起動できる拡張機能「Live Server」を紹介します。ファイル更新を検知して自動的にブラウザをライブリロードしてくれる機能もついているので、コードを書きながら表示確認の度にブラウザリロードする手間を省くことができます。

  • Services & Resource
追従ヘッダー実装時に使える動作・デザインパターン例

Read Article

追従ヘッダー実装時に使える動作・デザインパターン例

常にユーザーの視線に入るようにしておきたいとかサイトの回遊率をあげたいなどの理由で実装を頼まれることが多いと追従ヘッダー。単純に基本となる見栄えを維持してそのまま追従させることも多いですが、少し変化を加えてほしいという要望をもらうことも少なくないので、そういった場面で提案しやすいようによくある動作・デザインのパターン例をまとめました。

  • Inspiration
商用利用可能でパス編集可能なラインタイプアイコンを配布している「ICON BOX」

Read Article

商用利用可能でパス編集可能なラインタイプアイコンを配布している「ICON BOX」

作者様よりご連絡いただき、アイコンのデザインも個人的にすごい好みだったのでご紹介します。「ICON BOX」は、禁止事項に該当しなければ個人・商用問わず利用可能なフリーのアイコン素材を配布しているサイトです。特徴として配布しているアイコンはパスを編集できるようになっているので、形状や太さなどを自身で変更することができます。

  • Material
CSS Snippets #7

Read Article

CSS Snippets #7

CSSで「〇〇したい」とか「これどうするんだっけ...」というときに使えるものや地味だけど覚えておくと便利だと思う簡易的なスニペットを紹介します。以前であれば画像やJavaScriptを用いなければいけなかったものがCSSのみで表現できたり、上手く使えばよりシンプル且つ効率良く記述するのに役立つものもあるので、特にこれからCSSを学びたいという人や学び始めたばかりでもう少しレベルアップしたいという…

  • Tips
CodePenで公開されている、CSSを使ってIsometric(アイソメトリック)な見栄えを実装したデモ 15

Read Article

CodePenで公開されている、CSSを使ってIsometric(アイソメトリック)な見栄えを実装したデモ 15

CSSを使って要素を斜め上から見ているようなIsometric(アイソメトリック)な見栄えを実装しているデモをCodePenで公開されているものから紹介します。基本的にこのような見栄えを実装したいときによく使われる`transform`の`rotateX()`と`rotateZ()`を組み合わせたもので、そこに+αを加えて見栄えや動きを作っている感じです。

  • Tips

Close the search window,
please press close button or esc key.