CSS

スポンサーリンク
webデザイン支援

CSSのインデント自動整形ツール | 不揃いなCSSのインデントを揃えるアプリ

CSSのインデント自動整形ツール 整形する結果をコピー整形後のCSS:このツールアプリの目的CSSコードを編集していて、特にWordPressや他のエディタで整形が崩れてしまった経験はありませんか?手動でインデントを揃えるのは面倒で時間がかかり、場合によってはミスが発生してしまうこともあります。 CSSのインデントが揃...
webデザイン支援

htmlタグ内のwidthとheight指定を削除するツール

htmlタグ内のwidthとheight指定を削除するツール削除する結果をコピーする削除結果:このツールアプリの目的HTMLコードを編集していて、特にWordPressや他のエディタが自動的に指定する幅(width)や高さ(height)に悩まされたことはありませんか?列を増やしたり、スタイルを調整したりすると、知らな...
画像処理

連番画像ビューア ストレージ内の画像を順番どおりに閲覧できる

連番画像ビューア画像ファイルを一括選択して開き、左右キーで順番に閲覧してください。ファイルがサーバー等にアップロードされることはありません。このアプリはパソコン限定です。※ctrl+aでフォルダ内のすべてのファイルを一括指定でき、ctrlを押しながらマウスホイールを上下させることで拡大縮小できます。全画面表示画像がここ...
スポンサーリンク
webデザイン支援

グラディエント背景ジェネレーター – CSSコードをリアルタイムで生成

グラデーションサンプル選択した色と角度でグラデーションを生成します。始点の色 終点の色 角度 (0-360) グラディエント背景ジェネレーターについて 始点と終点の色を選択して、CSSで使うグラディエントの背景をリアルタイムに生成します。 生成されたCSSコードはそのままコピーしてウェブサイトに使えます。 プレビュー画...
Tech Memo

ポップアップメニューを実装する方法 | JavaScript Tech Memo

JavaScriptで「ポップアップメニュー」を実装してインタラクティブなページを作る方法ポップアップメニューは、ユーザーの操作をより直感的にし、インタラクティブな体験を提供するための効果的な機能です。hoverを使用して、ユーザーが特定のエリアにマウスを乗せたときにメニューが表示され、メニューにマウスがある間は表示が...
HTML&CSS

Gridを使ったレスポンシブなレイアウトデザインの作成方法 | CSS Tech Memo

Gridを使ったレスポンシブなレイアウトデザインの作成方法CSS Gridを使用すると、デバイスサイズに応じた柔軟なレイアウトを簡単に作成することができます。この記事では、CSS Gridを使ってレスポンシブなデザインを作成する具体的な方法について解説します。さらに、他のレイアウト方法との比較も行い、Gridの利点を最...
HTML&CSS

Grid vs Flexbox レスポンシブデザインにどちらを使うべきか | CSS Tech Memo

Grid vs Flexbox レスポンシブデザインにどちらを使うべきかレスポンシブデザインにおいて、CSS GridとFlexboxは、どちらも非常に優れたレイアウト方法です。しかし、それぞれには異なる特徴と長所・短所があり、適切に使い分けることが重要です。このガイドでは、GridとFlexboxを徹底的に比較し、レ...
HTML&CSS

漢字を含む日本語全角文字を斜め斜体にする コピペで使えるHTML+CSS

ここでは文字の斜体化について説明します。em要素を適用することで斜体化されるわけですが、この方法では漢字や平仮名といった全角文字は斜めになりません。多くの日本語フォントが斜体を用意していないためです。そこで、全く別の方法によって、全角文字を斜体化します。font-synthesisを用いる方法もある。HTML全角文字の...
HTML

dl dt dd の横並びと縦並び スマートフォンとPCでの表示の切り替え Prog-lab

Prog-labの趣旨は解説よりも、メモ置き場に近い情報コーナーです。タグの各意味と説明、目的dl,dt,ddを用い、tableのように横並びに表示させる。スマートフォンなどについてはdd,dtで改行させる。 dl 説明リスト dt 説明たしい用語 dd 説明用語が上揃えとなるパターン下線(border-bottom)...
HTML&CSS

dtとddの間で改行しない コピペで使えるHTML+CSS

用語の説明などで用いられる<dt>はブロックレベル要素ですから、原則として横並びにはできない。ここでは改行をせず、きれいに横並び、かつ、縦方向にも揃えて表示する方法について解説します。
メモ

WordPressのtableに勝手にheightが指定されてしまう問題

※メモ程度の記述です。ご了承ください。table tr td thなどにheight指定が入るwordpressで表を作って保存をし、後で作り直そうとすると、勝手にheightが指定されてしまっている問題です。全部手動でheightを消す必要はありません。この問題についてはcssで解決します。カスタムCSS欄に以下を記...
HTML&CSS

スクロールするとdivが表示されるようにする コピペで使えるHTML+CSS+JavaScript

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSS

ブラウザ右下に常に文章やBOX(div)を表示する コピペで使えるHTML+CSS

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSS

画像を加工せずに切り抜き表示する コピペで使えるHTML+CSS

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSS

CSSのみで縦型の棒グラフをつくる コピペで使えるHTML+CSS グラフ編

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSS

CSSのみで円グラフをつくる コピペで使えるHTML+CSS グラフ編

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。