プログラミング/HTML&CSS

サイト制作とカスタマイズ

“bogo”言語スイッチャー|特定のページだけ表示させないようにカスタマズ

記事内の「カスタムCSS」に数行書き込むだけでbogoの言語スイッチを非表示する方法を紹介しています。この方法は、サイト全体に影響を及ぼすことなく記事毎に言語スイッチを消すことができます。また、翻訳記事を書く際には書き込んだCSSを消すだけでもと通りの表示に戻すことができます。
サイト制作とカスタマイズ

“bogo”言語スイッチャーの表示文字をCSSでカスタマイズ

言語スイッチャーを設置した際に表示される「日本語」や「English」などの文字をCSSだけでカスタマイズする方法。一連の方法を理解しておくと、組み合わせ応用することでオリジナルの言語スイッチに装飾できます。
プログラミング学習

Chromeデベロッパーツール上でCSSを編集する方法

Chromeデベロッパーツール上でCSSを検証・編集する方法を図解で分かりやすく紹介しています。
プログラミング学習

Chromeデベロッパーツール上でHTMLを編集する方法

Chromeデベロッパーツール上でHTML検証・編集する方法を図解で分かりやすく紹介しています。
サイト制作とカスタマイズ

英語記事の「目次タイトル」と「パンくずリスト」を完全英語化

テーマ”Cocoon”のサイトでプラグイン"bogo"を使っています。目次タイトルを多言語にするために、プラグイン”Easy Table of Contents”と”Table of Contents Plus”を検証。
プログラミング学習

ファビコン設置と”RealFaviconGenerator”の使い方

"RealFaviconGenerator"は、ファビコンだけでなく、スマートフォンのホーム画面、"Windows" のスタートメニュー、タスクバーなどに使用する画像と、"head" 内に記述するコードを作成してくれます。
プログラミング学習

CSS Grid Layout(グリッドレイアウト)を使いこなす

グリッドの線番号や名前を使い自由にアイテムの位置を指定する方法と、簡単に聖杯レイアウトを作る方法。
プログラミング学習

CSS Grid Layout(グリッドレイアウト)の基本

CSSグリッドレイアウト(CSS Grid Layout)はグリッド(格子状のマス目)にアイテムを好きな順番に配置したり結合したりするレイアウト方法です。
プログラミング学習

CSS|枠線を作る「borderプロパティ」

要素のまわりに線を引くことで、見出しの優先順序をわかりやすくすることや、グループ毎に線で区切ることが出来ます。線の種類・太さ・色などを自由にカスタマイズできるので、サイトを思い通りにデザインすることができます。線の種類は「border-st...