CSSだけでtableを見やすく表示するカスタマイズ方法 - はるなぴログ

2018/10/14 55 users table 備忘録 CSS ロク レスポンシブ対応

CSSだけを使ってtableを見やすく表示するカスタマイズ方法を備忘録として書いておきます。 スマホ表示もレスポンシブ対応を含めて考えていきます。 tableを見やすくするためにテーブルセルに枠線をつけます。さらにヘッダ領域に背景色をつけ、何を比較しているのか目立つようにします。 このカスタマイズでtableを更に見... 続きを読む

Wordpressのメニューとサイドバーをスマホ用に横からスライドイン表示させるカスタマイズ方法

2015/03/19 60 users WordPress グローバルナビ モーダル アコーディオン

WordPressテーマのスマホ表示は、結構頭を悩ませるところです。 中でも特に、グローバルナビメニューや、サイドバーのスマホでの扱いには悩むところです。 僕はこれまで、グローバルナビの場合は、非表示にしておいて、アコーディオン表示させるか、モーダル表示させるかしていました。 サイドバーの扱いはもっとぞんざいで、回り込みを解除して、本文の下に表示させるということぐらいしか、できていませんでした。 ... 続きを読む

はてなブログのスマホ表示にグローバルナビゲーションを設置する - AIUEO Lab2

2014/09/19 95 users グローバルナビゲーション グローバルナビ スポンサーリンク

2014-09-19 はてなブログのスマホ表示にグローバルナビゲーションを設置する Webサイト制作 はてなブログ スポンサーリンク はてなブログにはPC表示用にもスマホ表示用にも、グローバルナビゲーションが純正では用意されていません。 スマホにもグローバルナビを設置したいなーという人は多いのでしょうか？昨日、吉本ユータヌキさんからこんなツイートをもらいました。 @aiueolab ひ！非常に嬉し... 続きを読む

パソコンのChromeで拡張機能なしでUser Agentを変更してスマホ表示を確認する方法 | love guava!

2014/05/03 57 users Chrome User Agent love guava

パソコンのChromeを使って、拡張機能なしでUser Agentを変更してスマホ表示を確認する方法をご紹介します。Chromeの標準機能だけで表示できるので、知っておくとなにげに便利ですよ！こんにちは。グアバです。 皆さんはブログのデザイン変更をしたとき、スマホ表示をどのように確認されていますか？ ベストなのはもちろん実機で確認することなのですが、手元にスマホがなかったり、いちいちスマホで確認す... 続きを読む

[M] スマホと同じ画面幅で表示確認できるChrome拡張「Mobile Layouter」が便利すぎる件 | mbdb (モバデビ)

2014/02/11 50 users mbdb モバデビ PHOTO Chrome拡張 拡張

うーん、スマホ表示確認できるUA偽装系Chrome拡張機能では、もしかしたら一番いいかもしれません。 「Mobile Layouter」という拡張機能なんですが、ブログのスマホ側の調整時に大変便利に使うことができました。 以前使っていたUA偽装系の拡張から乗り換えちゃいましたよ。 Photo:iPhone By GONZALO BAEZA 以前までは「User-Agent Switcher」という... 続きを読む