「css」タグアーカイブ

text-indent:-9999pxが使えない時はこの方法

サイトのロゴ等、テキストにタグを指定して画像に置き換える方法は定番だが、text-align:rightを使いテキストを右揃えで使っている場所ではtext-indent:-9999pxの方法は使えない。

三点リーダとは、いわゆる中黒「・」が３つ並んで１文字分になっている記号のこと。

ウェブサイトの表示は高速であればあるほどユーザーの離脱率は低くなりUX（ユーザーエクスペリエンス）も向上する。表示速度もサイト評価の対象となるとGoogleもコメントしているように、サイトの高速化は急務といえる。大き… 続きを読む »

Javascriptも使わず、スタイルシートのみで簡単にテーブルのデザインを変更して、スマートフォン等でも見やすくすることが可能です。 CSS /* 通常時の設定 */ #list-tbl{ border-collaps… 続きを読む »

iPhone・Android等のスマートフォンに対応させるWordPress用のプラグインWordpress PDA & iPhone（wp-pda）はベースにJquery mobileを使用している。そのため… 続きを読む »

CSSで複数のclassを使う場合、 <div class=”aaa”> <div class=”bbb”> </div> </div> のような表記をまとめて <d… 続きを読む »

シンプルな構造で設置も簡単、マウスで移動も自由でボタンで消すことも出来る、MacやWindowsのスティッキーズ風のモーダルウィンドウ（Modal window）。ポップアップウィンドウに変更するのも簡単。導入は以下の… 続きを読む »

FirefoxにはIEのように独自の実装擬似クラスがあるから、CSSに独自実装擬似クラス（例えば:-moz-any-link）を入れることにより、Firefoxだけに適用させるCSSを書くことができる。方法は簡単【例… 続きを読む »

CSS Sprite・CSSスプライトとは、ページに表示される全部の画像をひとつにまとめて一枚の画像にしておき、表示する際にその一枚の画像から必要な部分のみをCSSで切り出して使うテクニック。簡単な例として、メニュー等で… 続きを読む »