HP制作
【jquery.cookie.js】画面遷移してもナビゲーションの状態を維持するサンプル
2023.03.08
WEBサイトのアコーディオンやナビゲーションの開閉状態を維持しておきたい場合、Cookie（クッキー）を使って制御する方法があります。Cookieとは、WEB…
HP制作
【CSS】brタグを無効化する（消す）方法。改行で半角スペースが入る問題にも対応
2022.06.03
レスポンシブでホームページを作ることが常識となった今、スマホ表示の時にbrタグを削除した方が都合がいい場面がちょくちょく出てくると思います。ググって調べてみる…
HP制作
【CSS】position:relativeで右寄せにする方法
2022.04.20
だ～いぶ久しぶりの更新ですが、内容はCSSの備忘録というかなりニッチな内容となっていてなんだか申し訳ない…（汗）[position:relative]で右寄せ…
HP制作
【CSS】セレクタに正規表現を使う方法＆サンプル集
2020.12.03
CSSのソースは少ないコードでシンプルにできるとスマートですよね。管理も楽になり容量も軽くなる、といいことずくめです。ちょっと上級テクニックになりますが、CS…
HP制作
Bootstrapで5カラム(5分割)レイアウトを実現する方法
2020.08.20
Bootstrapは12分割のグリッドを採用しているため、通常は5等分されたレイアウトを実現することができません。しかし、コンテンツやデザインの都合上、5分割…
HP制作
【CSS】横並びメニューの区切り線を「隣接セレクタ」と「疑似要素」を使って実装する方法
2019.05.30
グローバルメニューやフッタメニューで利用することの多い区切り線（罫線）。皆さんはどのように実装していますか。CSSの[border]を使えば簡単に作ることがで…
HP制作
【CSS】リンク(aタグ)のクリック範囲を親要素全体(div)に広げる方法
2018.11.14
今回はCSSでリンク（aタグ）のクリック範囲を親要素全体に広げる方法を紹介します。PCサイトはもちろん、スマホサイトでは特にリンクの範囲が広い方がユーザーとし…
HP制作
【jQuery】外部リンクに自動でFont Awesomeアイコンを表示する方法
2018.08.21
外部リンク（新しいウィンドウで開くリンク）に自動で外部リンク用のアイコンを表示する方法を紹介。直接HTMLに書き込むこともできますが、その都度コードを打ち込む…
HP制作
【CSS】Font Awesome 5を疑似要素で指定するとアイコンが表示されない時の解決方法
2018.08.14
FontAwesome5で、CSSの疑似要素（::before,::after）でcontent指定をした際、アイコンが表示されない場合の解決方法です。…
HP制作
【CSS】position:fixedで固定している要素を横スクロールさせる方法
2018.01.25
CSSの[position:fixed]で要素を固定すると、ブラウザ幅がコンテンツ幅を下回った際に固定している要素だけ横スクロールしてくれません。最近のWEB…