-
symbol・useタグを使ってSVGアイコンを使い回す方法
SVGアイコンはインラインで表示すると、CSSで色を変えられたり色々便利です。 しかし、コードが長くなってしまうため、たとえばボタンの矢印部分をSVGアイコンで繰り返し使う場合などは、記述量が多くなってしまいソースが読み…
-
SVGとは?ツール毎のSVG書き出し方法、SVGコードの基本的な使い方を解説
SVGはベクター形式の画像データです。 ベクター形式は、点や線、色、カーブを数値データで記録するため、軽量で拡大しても画像が荒れない点が大きな特徴です。 今回は、SVGとJPG・PNGとの違いやメリット・デメリット、SV…
-
【clip-pathの使い方】CSSで画像をクリッピングする方法
今回は、画像を様々な形でクリッピングしたい場合に便利なCSSプロパティclip-pathの使い方を解説します。 clip-pathが使えるようになると、指定した要素の一部のみをくり抜いて表示させることができるようになりま…
-
$(function() {})の意味は?$(window).on(‘load’,function(){})との違い
jQueryの初学者には、$(function() {})を意味も分からず「おまじない」のように記載している方も多いのではないでしょうか? しかし、実際には、JavaScriptやjQueryを実行するタイミングを決める…
-
【JavaScript】debounce(デバウンス)とは?実装方法を解説
Webサイトやアプリの開発中に、ウィンドウのリサイズやinputの入力時に何らかの処理を行いたい場面がよくあります。 しかし、これらのイベントが発生するたびに処理が連続して呼び出されると、ブラウザに大きな負担がかかり、パ…
-
【説明リストタグ】dl・dt・ddタグの正しい使い方を解説
今回はHTMLタグの中で説明リストを作る際に使用されるdl・dt・ddタグの正しい使い方を解説していきます。 dl・dt・ddタグは情報の整理や意味づけに役立つため、ぜひ覚えておくと良いでしょう。 dl・dt・ddタグは…