CSSで要素の横並びを実現する手法の1つとして、「display:inline-block;」を使う方法があります。 例えば、以下のようなHTMLがあったとします。 CSS側は以下のように指定すれば、簡単にリストを横並び…
display:inline-block;でできた隙間(余白)をなくす3つの方法
指定した色をベースに彩度や透明度などを変化させた色を作成することができるWEBサービス「ColorMe」
ColorMeは、指定した色をベースに彩度や透明度、明度などを変化させた色を作成することができるWEBサービスです。 ColorMeの使い方 ColorMeにアクセスして、ベースの色を指定します。 下部にある「Color…
プラグインなしでWordPressをメンテナンスモードにする方法
プラグインなしでWordPressをメンテナンスモードにする方法をご紹介いたします。 メンテナンス中のページを表示するためのプラグインである「WP Maintenance Mode」や「Simple Maintenanc…
WordPressの投稿編集画面を開くときに必ずテキストモード(HTMLモード)で開くようにする方法
WordPressの投稿編集画面には、ビジュアルエディタとテキストエディタの2種類の投稿エディタがあります。テキストモードではHTMLを直接入力することができるのですが、一旦ビジュアルモードに切り替えると自動整形機能によ…
AndroidのChromeでページを開いた時にブラウザのタブの色を変更させる方法
AndroidのChromeでサイトを開いた時に、タブの色を変更させる方法をご紹介いたします。 以下デモページにAndroidのChromeからアクセスすると、タブの色が青色に変わります。 デモページを見る HTML内に…
Windows10のエクスペリエンスインデックス(PC性能の測定)の結果表示ツール「WEBmarks」
WEBmarksは、Windows10で測定したベンチマークテストの結果を表示させるためのWEBサービスです。 Windows7やVistaには、PCの能力を測定するエクスペリエンスインデックスという機能が備わっていまし…
CSSアニメーションで要素が一瞬伸縮したりちらつく場合の対処法
transitionやtransformでCSSアニメーションを要素にかけた時に、要素の幅が一瞬だけ伸縮してしまったり、ちらついてしまう場合があります。私もよく以下のようなCSSを指定することがあるのですが、アニメーショ…