タグの中に
タグは入れられません｜今さら聞けないHTMLの基礎](https://8192.jp/blog/web-create/2022/08/07/2336/) - Web制作者の人からしたら知ってて当たり前の知識ですが、ちょっとHTML書けます！くらいの人はやりがちなミスな… - [Webコーダーとして飯を食うために最低限必要なスキル](https://8192.jp/blog/web-create/2022/08/04/2314/) - 一応Web制作で飯を食っている人間なので、自分の思う「Webコーダーに求められるスキル」をまとめてみました。 … - [【CSS】PCとスマホで改行位置を調整する方法を2種類紹介します](https://8192.jp/blog/web-create/2022/08/03/2287/) - メインビジュアル部分のテキストなど、PCとスマホで改行の位置を調整したいことは多々あります。今回紹介するのはか… - [WordPressのブロックエディタにタイトル文字数のカウント機能を実装する](https://8192.jp/blog/web-create/2022/08/01/2272/) - タイトルはクリック率に直結する部分なので、検索からの流入を増やしたいなら必ず意識したいポイントです…ってブログ… - [【速報】手抜きコーダーぼく、色指定にhsla()を使うとめちゃくちゃ楽なことに気付いてしまう](https://8192.jp/blog/web-create/2022/07/25/2157/) - 16進表記もRGBA()もいらなかったんや…っていうのは嘘なんですけど、HSLA()での色指定がすげえ便利って… - [CSSのみでページ内リンクのスムーススクロールと位置調整を実装する方法](https://8192.jp/blog/web-create/2022/07/25/2142/) - こういうのってjQuery等でスクリプトを書くor適当なライブラリを突っ込んで実装している人が多そうですが、I… - [2000種類以上の高品質なアイコンを無料でダウンロードできる神サイト『Remix Icon』](https://8192.jp/blog/web-create/2022/07/24/2127/) - Webサイトやアプリケーション等、幅広い用途で使えそうなアイコンが大量に配布されているサイトを紹介します。 こ… - [CSSでモンスターボールを作ってたら一日が終わった](https://8192.jp/blog/web-create/2022/07/23/2115/) - なぜ作ったシリーズ。多分500人くらい先人がいる。 PureCSS モンスターボール See the Pen … - [Live Sass CompilerのCSS出力先をカスタマイズする](https://8192.jp/blog/software/2022/07/23/2028/) - 久々にSassを使うことになったんでVSCodeにLive Sass Compilerという拡張機能をぶち込ん… - [「position:absolute」と「transform:translate()」を使った中央寄せの落とし穴](https://8192.jp/blog/web-create/2022/07/21/1982/) - 気にするほどではないけれど、こういうのは一応知っておいたほうがいいです。 まず、要素を中央寄せするときによく使… - [CSSのみでボーダーに綺麗なグラデーションを掛ける方法+α](https://8192.jp/blog/web-create/2022/07/20/1950/) - 近未来的なデザインのWebサイト等で使えそうな、グラデーションの掛かったボーダーの作り方を紹介します。（調べて… - [【CSS】transitionで使えるtiming-functionまとめ+cubic-bezierの設定例も紹介](https://8192.jp/blog/web-create/2022/07/18/1914/) - transitionとかanimationの実行中に「どのように値を変化させるか」を指定できる〇〇-timin… - [iPhoneで電話番号が勝手にリンクされるのを無効化する方法](https://8192.jp/blog/web-create/2022/07/17/1903/) - 毎回「なんて書けばいいんだっけ…？」って忘れてググってるので、自分用にメモ。 iPhoneの余計な仕様 めちゃ… - [【CSS】Flexアイテムを左右いっぱいに広げつつ、数が足りないときは左寄せにする方法](https://8192.jp/blog/web-create/2022/07/17/1844/) - たまには実用的なテクニックも書きます。 Flexは非常に便利なプロパティですが、ちょっと凝ったレイアウトを実装… - [CSSのみで「続きを読む」ボタンを実装&エフェクトも掛けてみる](https://8192.jp/blog/web-create/2022/07/15/1778/) - 有名なテクニックですが、CSSのみで「続きを読む（ReadMore）」ボタンを実装する方法を紹介します。アコー… - [マウスホバーで画像を分割させるアニメーションをCSSだけで作る方法](https://8192.jp/blog/web-create/2022/07/14/1737/) - マウスオーバーすると画像が分割されて下層のレイヤーが現れる、という表現をCSSのみで作ってみました。手軽に作れ… - [【CSS】文字にinstagramのロゴような色収差（色ズレ）エフェクトを掛ける方法](https://8192.jp/blog/web-create/2022/07/14/1719/) - 光の屈折率の分散によって起きる色収差（色ズレ）っぽいエフェクトを、CSSだけで再現してみようという小ネタです。… - [CSSのみで市松模様を作る方法を2種類紹介](https://8192.jp/blog/web-create/2022/07/12/1694/) - 作る機会があるかどうかは置いといて、CSSだけで市松模様が作る方法を解説します。ちなみに鬼滅の刃は見ていません… - [【CSS】ハンバーガーメニューに使えそうなボタンのアニメーションを4つ作っておいた](https://8192.jp/blog/web-create/2022/07/12/1642/) - 実務でも結構な頻度で作ることになるハンバーガーメニューですが、毎回1から作るのは面倒なのでコピペで使えるように… - [WordPressで読み込まれる『jquery-migrate.min.js』とは？停止方法も紹介します](https://8192.jp/blog/web-create/2022/07/11/1633/) - WordPressで作られたページのソースコードを見ていたら、見覚えのない『jquery-migrate.mi… - [お洒落なグラデーションが300種類以上も紹介されている『uiGradients』というWebサイトが便利すぎる](https://8192.jp/blog/web-service/2022/07/10/1612/) - 以前『CSS Gradient』というグラデーション作成のためのツールを紹介しましたが、グラデーションのに使う… - [【CSS】footerを最下部に固定するのにabsoluteを使うのはもう古い？もっとスマートな書き方を紹介します](https://8192.jp/blog/web-create/2022/07/09/1578/) - footerを最下部に固定する方法は色々ありますが、おそらくposition:absoluteを使う方法が一番… - [WordPressでアイキャッチ画像を設定する関数『set_post_thumbnail』](https://8192.jp/blog/web-create/2022/07/09/1567/) - 備忘録です。 普通は投稿画面の「アイキャッチ画像を設定」というパネルから画像を選択（orアップロード）すればO… - [【CSS】今更だけど「vw,vh,vmax,vmin」の挙動について詳しく解説してみる](https://8192.jp/blog/web-create/2022/07/09/1543/) - Web制作に携わってる我々が普段何気なく使っているvwやvhという単位ですが、初心者の方には使い所や「%」との… - [【CSS】疑似要素のbefore,afterを複数個使いたくなったときの対処法](https://8192.jp/blog/web-create/2022/07/08/1516/) - CSSの疑似要素である::beforeと::afterですが、テキストの頭にアイコンを付けたり要素にオシャレな… - [【CSS】hover時にアンダーラインが出てくるアニメーションの作り方](https://8192.jp/blog/web-create/2022/07/08/1468/) - タイトルの通り、リンク等のテキストにマウスオーバーした際、アンダーラインがニョキッと出てくるアニメーションの作… - [Webサイトに使われているフォントを調査できるChrome拡張機能『WhatFont』](https://8192.jp/blog/software/2022/07/07/1441/) - Webサイトを作る際に他のサイトを参考にすることがよくあるんですが、最近はWebフォントを採用しているところが… - [CSSの数学関数「clamp(),min(),max()」の使い方について調べてみた](https://8192.jp/blog/web-create/2022/07/01/1379/) - 「存在自体は知っていたけど、IEに非対応だからなぁ…」という理由でスルーしていた、CSSの割と新しい機能である… - [漢字も使える！ファミコン風のドットフォントを11種類紹介します（文字サンプル有り）](https://8192.jp/blog/software/2022/06/30/1345/) - レトロな雰囲気の制作物やゲーム開発の場面で使えそうな、漢字対応の8bit風のドットフォントを11種類紹介します… - [CSSのグラデーションを簡単に作成できるWebサービス『CSS Gradient』が便利すぎる](https://8192.jp/blog/web-service/2022/06/29/1313/) - なにかと使う機会が多いCSSのグラデーションですが、角度・カラーコード・%を入れて確認→調整…と繰り返すのは非… - [YouTubeの低評価数が見えるようになるChrome拡張機能『Return YouTube Dislike』](https://8192.jp/blog/software/2022/06/26/1217/) - みんな知っていると思いますが、去年からYouTubeの低評価数が見えなくなりましたよね。別に見えなくても何も困… - [【CSS】ブログ記事の見出しで使えそうなスタイル一覧作っといた](https://8192.jp/blog/web-create/2022/06/25/1073/) - 暇だったんで、ブログ記事やWebサイトの見出しに使えそうなスタイルを量産しておきました。こういうの作ってまとめ… - [CSSのみでアスペクト比を固定する「aspect-ratio」の使い方](https://8192.jp/blog/web-create/2022/06/23/1032/) - 最近ようやくIEが死滅したので、今まで「IEも対応させなきゃいけないからなぁ…」という理由で使えなかった（もし… - [【CSS】親要素をはみ出して子要素の背景を画面端まで広げる方法](https://8192.jp/blog/web-create/2022/02/21/1008/) - 子要素を親要素の枠からはみ出させるという表現は、凝ったレイアウトのWebサイトだとよく使われています。ただ、こ… - [家電メーカーのBALMUDAがスマートフォンを発売｜デザインがすごく良い！けど…](https://8192.jp/blog/note/2021/11/17/886/) - キッチン家電や空調等を開発・販売しているBALMUDAが、26日からAndroidスマートフォンの販売を開始し… - [ページ読み込み時のフェードイン効果をCSSだけで実装する方法](https://8192.jp/blog/web-create/2021/11/17/840/) - ページ読み込み時のアニメーション効果をお手軽に実装する方法を紹介します。 ページ全体にアニメーション効果を付与… - [jQueryを使ってテキストをクリップボードにコピーするボタンを作成する方法](https://8192.jp/blog/web-create/2021/11/16/793/) - なんとなーく気になったので調べてみました。コードを公開するようなサイトだと使えそうです。 基本形 HTML コ… - [USB付きの電源タップ買ったらめちゃくちゃ便利だった【TESSAN TS-103】](https://8192.jp/blog/note/2021/11/13/765/) - 今まで使ってた電源タップがぶっ壊れたのでAmazonで新しいものを探したんですが、今ってUSBポートが付いてる… - [jQueryを使った世界一シンプルなアコーディオンの作り方](https://8192.jp/blog/web-create/2021/11/11/694/) - アコーディオンは使用頻度が高いので、備忘録に。 .slideToggleで簡単アコーディオン作成 jQuery… - [サイトが劇的に軽くなる、pictureタグを使ったwebp画像の実用化について](https://8192.jp/blog/web-create/2021/11/01/560/) - 最近仕事でWebPを扱うことが増えてきたので、タグを使ったお手軽なWebP対応の… ## 固定ページ - [サンプルページ](https://8192.jp/sample-page/) - これはサンプルページです。同じ位置に固定され、(多くのテーマでは) サイトナビゲーションメニューに含まれる点が… - [Web制作で使える便利なコード集](https://8192.jp/product/code-collection/) - … - [ABOUT](https://8192.jp/about/) - 8192.jpについて 当ブログは@Leo_8192が運営している個人ブログです。一応Web系のお仕事をしてい… - [ハマり確率計算機](https://8192.jp/product/pachi_calc/hamari_calc/) - … - [パチ系計算ツール](https://8192.jp/product/pachi_calc/) - … - [CONTACT](https://8192.jp/contact/) - 募集内容 Webサービスや新製品等のレビュー依頼 ネタの提供や寄稿の依頼 応援メッセージ etc… 皆さまのメ… - [SSBU キャラクターシャッフルツール](https://8192.jp/product/ssbu/shuffle/) - … - [大乱闘スマッシュブラザーズSP](https://8192.jp/product/ssbu/) - … - [VoxelArt](https://8192.jp/product/voxel-art/) - … - [PRODUCT](https://8192.jp/product/) - … - [BLOG](https://8192.jp/blog/) - … ## コード集 - [クリックで開閉するシンプルなアコーディオン（jQuery）](https://8192.jp/product/code-collection/2023/09/04/2796/) - よくあるアコーディオンを実装するためのコードです。 仕様 見た目はリスト風 項目名をクリックすると、その下のコ - [マウスオーバーで表示されるツールチップ（jQuery）](https://8192.jp/product/code-collection/2023/09/04/2793/) - カーソルを乗せたときにちょっとした解説や用語説明などを表示するツールチップ機能です。 HTML - [右から現れるシンプルなハンバーガーメニュー](https://8192.jp/product/code-collection/2023/09/03/2783/) - よくあるハンバーガーメニューを実装するためのコードです。 仕様 メニューボタンをクリックすると画面右からメニュ - [タブで切り替え出来るコンテンツ](https://8192.jp/product/code-collection/2023/09/01/2781/) - タブによって切り替えることが出来るコンテンツを実装する際に使えるコードです。 HTML - [画面中央にポップアップするモーダルウィンドウ](https://8192.jp/product/code-collection/2023/09/01/2778/) - ボタンクリックで画面中央にポップアップするモーダルウィンドウ（ダイアログ）を作るためのコードです。 仕様 ボタ - [スクロールに応じて要素の表示・非表示を切り替える](https://8192.jp/product/code-collection/2023/08/31/2741/) - メニューバーや上部のロゴなど、スクロールに応じて要素の表示・非表示を切り替える必要がある場合に使えるコードです - [スクロールに合わせて要素が下からフワッと出てくるエフェクト](https://8192.jp/product/code-collection/2023/09/01/2764/) - スクロールに合わせて要素が下からスライドインしてくるエフェクトを実装するためのコードです。 HTML ## カテゴリー - [パチンコ・パチスロ](https://8192.jp/./blog/pachi/) - [Web制作](https://8192.jp/./blog/web-create/) - [ゲーム](https://8192.jp/./blog/game/) - [ブログ](https://8192.jp/./blog/) - [雑記](https://8192.jp/./blog/note/) - [ソフトウェア](https://8192.jp/./blog/software/) - [Webサービス](https://8192.jp/./blog/web-service/) - [AI](https://8192.jp/./blog/ai/) ## タグ - [WordPress](https://8192.jp/tag/wordpress/) - [WebP](https://8192.jp/tag/webp/) - [HTML](https://8192.jp/tag/html/) - [アコーディオン](https://8192.jp/tag/アコーディオン/) - [CSS](https://8192.jp/tag/css/) - [jQuery](https://8192.jp/tag/jquery/) - [MagicaVoxel](https://8192.jp/tag/magicavoxel/) - [VoxelArt](https://8192.jp/tag/voxelart/) - [日本語化](https://8192.jp/tag/日本語化/) - [レビュー](https://8192.jp/tag/レビュー/) - [ガジェット](https://8192.jp/tag/ガジェット/) - [クリップボード](https://8192.jp/tag/クリップボード/) - [フェードイン](https://8192.jp/tag/フェードイン/) - [BALMUDA](https://8192.jp/tag/balmuda/) - [Android](https://8192.jp/tag/android/) - [プレスリリース](https://8192.jp/tag/プレスリリース/) - [GANTZ極 THE SURVIVAL GAME](https://8192.jp/tag/gantz極-the-survival-game/) - [レイアウト](https://8192.jp/tag/レイアウト/) - [Web制作](https://8192.jp/tag/web制作/) - [見出し](https://8192.jp/tag/見出し/) - [Webデザイン](https://8192.jp/tag/webデザイン/) - [アニメ](https://8192.jp/tag/アニメ/) - [アーニャ](https://8192.jp/tag/アーニャ/) - [PureCSS](https://8192.jp/tag/purecss/) - [スパイファミリー](https://8192.jp/tag/スパイファミリー/) - [Chrome](https://8192.jp/tag/chrome/) - [拡張機能](https://8192.jp/tag/拡張機能/) - [YouTube](https://8192.jp/tag/youtube/) - [ブラウザ](https://8192.jp/tag/ブラウザ/) - [グラデーション](https://8192.jp/tag/グラデーション/) - [Webサービス](https://8192.jp/tag/webサービス/) - [配色](https://8192.jp/tag/配色/) - [フォント](https://8192.jp/tag/フォント/) - [ドット](https://8192.jp/tag/ドット/) - [ファミコン](https://8192.jp/tag/ファミコン/) - [疑似要素](https://8192.jp/tag/疑似要素/) - [アイキャッチ画像](https://8192.jp/tag/アイキャッチ画像/) - [WP関数](https://8192.jp/tag/wp関数/) - [sticky](https://8192.jp/tag/sticky/) - [flex](https://8192.jp/tag/flex/) - [ハンバーガーメニュー](https://8192.jp/tag/ハンバーガーメニュー/) - [レスポンシブ](https://8192.jp/tag/レスポンシブ/) - [Chrome拡張機能](https://8192.jp/tag/chrome拡張機能/) - [TikTok](https://8192.jp/tag/tiktok/) - [画像エフェクト](https://8192.jp/tag/画像エフェクト/) - [metaタグ](https://8192.jp/tag/metaタグ/) - [iPhone](https://8192.jp/tag/iphone/) - [animation](https://8192.jp/tag/animation/) - [transition](https://8192.jp/tag/transition/) - [VSCode](https://8192.jp/tag/vscode/) - [Sass](https://8192.jp/tag/sass/) - [ポケモン](https://8192.jp/tag/ポケモン/) - [ゲーム](https://8192.jp/tag/ゲーム/) - [Webフォント](https://8192.jp/tag/webフォント/) - [アイコン](https://8192.jp/tag/アイコン/) - [HSLA](https://8192.jp/tag/hsla/) - [ちいかわ](https://8192.jp/tag/ちいかわ/) - [デーモンコア](https://8192.jp/tag/デーモンコア/) - [SEO](https://8192.jp/tag/seo/) - [ブログ運営](https://8192.jp/tag/ブログ運営/) - [改行](https://8192.jp/tag/改行/) - [コーダー](https://8192.jp/tag/コーダー/) - [写真](https://8192.jp/tag/写真/) - [素材](https://8192.jp/tag/素材/) - [読み物](https://8192.jp/tag/読み物/) - [ソフトウェア](https://8192.jp/tag/ソフトウェア/) - [画像ビューア](https://8192.jp/tag/画像ビューア/) - [AVIF](https://8192.jp/tag/avif/) - [LP](https://8192.jp/tag/lp/) - [6.2号機](https://8192.jp/tag/6-2号機/) - [6.5号機](https://8192.jp/tag/6-5号機/) - [FAIRY TAIL2](https://8192.jp/tag/fairy-tail2/) - [SIRIUS](https://8192.jp/tag/sirius/) - [キャッツ・アイ](https://8192.jp/tag/キャッツ・アイ/) - [犬夜叉](https://8192.jp/tag/犬夜叉/) - [甲鉄城のカバネリ](https://8192.jp/tag/甲鉄城のカバネリ/) - [鉄拳5](https://8192.jp/tag/鉄拳5/) - [AI](https://8192.jp/tag/ai/) - [StableDiffusion](https://8192.jp/tag/stablediffusion/) - [StabilityMatrix](https://8192.jp/tag/stabilitymatrix/) - [AI画像生成](https://8192.jp/tag/ai画像生成/) - [天秤AI](https://8192.jp/tag/天秤ai/) - [ChatGPT](https://8192.jp/tag/chatgpt/) - [Gemini](https://8192.jp/tag/gemini/) - [Claude](https://8192.jp/tag/claude/) - [Perplexty](https://8192.jp/tag/perplexty/) - [Llama](https://8192.jp/tag/llama/) - [Mixtral](https://8192.jp/tag/mixtral/) - [チャットAI](https://8192.jp/tag/チャットai/) ## 言語 - [JavaScript・jQuery](https://8192.jp/language/js/) ## コードタグ - [タブ](https://8192.jp/code-tag/タブ/) - [モーダルウィンドウ](https://8192.jp/code-tag/モーダルウィンドウ/) - [要素の表示制御](https://8192.jp/code-tag/要素の表示制御/) - [メニュー](https://8192.jp/code-tag/メニュー/) - [ツールチップ](https://8192.jp/code-tag/ツールチップ/) - [アコーディオン](https://8192.jp/code-tag/アコーディオン/)