Cursorを使ってみる
AI技術を活用した機能が特長のコードエディタ「Cursor」を簡単に使ってみます。...
MTブロックエディタを使ってみる
Movable Typeのコンテンツタイプで使用できるブロックエディタは以前記事内で取り上げましたが、MTブロックエディ...
Yu Gothic UIで「」が重なって表示される
ChatGPTで調べ物をしていた際、「A」「B」のように「」を続けて入力すると 」「 部分が重なって表示される現象に遭遇...
WordPressのユーザーの権限グループ
WordPressでユーザー毎に設定する権限グループについて調べる機会があったのでメモ。...
ReactでCSSを利用する方法
Reactでスタイル設定を行う方法についていくつか試してみます。...
axe-coreでアクセシビリティのテストツールを作成する
以前にaxe DevToolsという拡張機能を使ってみる記事を投稿しましたが、そのコアエンジンにあたるaxe-coreと...
CSSの:not()で複数の条件を指定する
CSSの:not()で複数条件を指定した際の表示について試してみます。...
別タブを開いた際のsetIntervalとsetTimeoutの挙動と対策
setIntervalやsetTimeoutを使った処理中に別タブを開くと、元のタブに戻ってきた際に挙動がおかしくなるこ...
特定要素内にフォーカスした時のイベントを設定する
特定の要素内にフォーカスした時に処理をしたいということがあったので、実装方法について調べたことをメモ。...
Puppeteerを使ってみる
ヘッドレスブラウザのChromiumを操作するライブラリ「Puppeteer」を使ってみます。...
axe DevToolsを使ってみる
ウェブページのアクセシビリティテストツールのaxe DevToolsを使ってみます。...
ReactのuseStateを使ってみる
ReactのuseStateについて簡単にまとめてみます。...
CSSでslideDownを実装する
CSSのgrid-template-rowsを使って、jQueryのslideDown()のようなアニメーションを実装す...
タブの実装でアクセシビリティを意識する
ARIA Authoring Practices Guideのページを参考に、タブの実装時にアクセシビリティの面を考慮し...
details要素での開閉時にJavaScriptで処理を行う
以前にdetailsタグの使い方やアコーディオンとして使用した際のメリットについて記事にしましたが、今回は開閉時にJav...
Pug使用時にHTMLのソースコード上で改行する
Pugでaタグやspanタグを続けて入力すると、コンパイルしたHTMLのソースコード上だと、改行されずに1行で出力されま...
display: contents を使ってみる
fieldset要素とlegend要素の記事でCSSの設定をする際にdisplay: contents を使いましたが、...
Reactのイベントハンドラについて
Reactのイベントハンドラについて調べたことをメモ。...
clip-pathで三角形を作成する
以前にborderを使った三角形やSassのmixinの記事を投稿しましたが、今回はclip-pathを使った三角形の作...
fieldset要素とlegend要素を装飾する
fieldset要素とlegend要素を使用したことがあまりなかったのですが、少し前にこれらの要素にCSSを設定しようと...