HTML CSS 背景画像（background-color）削除。background-colorで色の指定してる場合で、レスポンシブである範囲背景色を消す方法。【サンプルコードあり】
HTML・CSSでbackground-colorを削除する場合、 コーディングしててレスポンシブである範囲 だけ背景の色background-colorで指定しててその色を を消したい場合の方法が、あれッ？てなったんでその方法書きます。 ...
inopro
HTML CSS 
HTML CSS HTML・CSSでコーディングする時、理解しておきたいブロック要素・インライン要素の理解は必要。よく見る要素を記事に書いてみました。
HTML・CSSでコーディングする際に 最低理解しといたほうがいい。 コーディングする際の要素には、 ブロック要素と、インライン要素ってのがある。 この性質を理解してるかしてないかでは まったく違ってくる。 よく見る、ブロック要素とインライ...
HTML CSS Grid 画像リストを横並びにして、画像の右端にテキストを配置。グリッドレイアウトで実装レスポンシブ設定までしました。【サンプルコードあり】
画像のリストを横並びにして、その右端に文字を配置する設定。 今回は、グリッドレイアウトを使ってやってみました。 他にもflexも試したが、今回はグリッドレイアウト を使った方がレスポンシブを考えると簡単に 実装できたのでその方法を記事にしま...
HTML CSS HTML・CSSでドロップダウンリストのクリックしたらリストが表示されるパターンを作成してみました。【サンプルコードあり】
HTML・CSSでドロップダウンリストを作成してみた。 今回は、ホバーじゃなくクリックでリストが 下に出てくる方法でやってみました。 今回は、HTML・CSSだけでやってます。 JavaScriptの指定なども加えると もっと動きをつけるこ...
VScode VScode スニペット登録方法と注意点記事にしました。コードを書く時間短縮・スペルミスによるエラー減少になるのでオススメ！【サンプルコード有り】
VScodeを使ってコードを書いてる時、スニペットに 前もって任意のコードを登録しとくと、登録した 文字で自動でコードを記入してくれる機能がある。 その登録方法と注意点を記事にしてみました。 この作業は、スニペットを登録すると言います。 登...
HTML CSS Swiperで画像にbox-shadowの効果を実装する１例とSwiperのレスポンシブの指定方法わかったんで記事にしてみました。【サンプルコードあり】
Swiperで画像をスライドする時に、 画像に影をつける方法を、図を使って説明。 また、Swiperで表示する画像の枚数を 画面サイズで変更する、レスポンシブの 指定もやってみました。 この方法実装しようとした時に、いろいろ検索 したがピン...
HTML CSS デザインカンプ Adobe IllustratorのデータをFigmaで確認する方法ないか調べてみた。
コーディングの仕事でカンプデータの受け取りの方法は XD・Illustrator・Figmaを使用する場合が多い。 私の場合は、今はFigmaが多い。 今回、カンプはAdobe Illustratorでとゆうことで、ちょっと慌てました。 そ...
HTML CSS 特定商取引法に基づく表示をHTML・CSSで書いてみた。tableタグ・listタグ・dlタグ各タイプで作成。【サンプルコードあり】
特定商取引法に基づく表示のページどうしてますか？ HTMLで書いたり、画像にしてアップしてる場合もみかけます。 今回HTMLでコーディングしてみました。 完成はこんな感じです。 サンプルコードもこの記事の中で掲載しております。 今回HTML...
WordPress WordPressでサイト構築時、ページの上部の黒いバー（ツールバー）を消す方法やってみた。簡単だけどわかりにくいところにある。
Wordpressでサイト作成時、管理画面でサイトを開くと 画面の上部に表示される黒いバーを消す方法。 この黒いバーが表示された状態で、コードを書いて 変更しても、確認時にこのバーが表示されて、 その分見え方が変わってくるので、カスタマイズ...
プログラミング drawerメニューがハンバーガーボタンをクリックしても 表示されない時の解消方法。ChatGPTさんに聞いてみたらJavaScriptライブラリがページで競合が原因
JavaScriptを使ってdrawer.jpの設定が結構苦手で今回も drawerメニューがハンバーガーボタンをクリックしても 表示されないという、沼にはまっちゃいました。 いろいろ試行錯誤した結果、解決できたので この記事で共有したいと...