HOME > blog > CSS
カテゴリー: CSS

Bootstrap から考えるCSSフレームワークに対する雑感

簡単にビジュアルと整える程度で済むなら CSSフレームワーク はとても便利なので、基本的な部分くらいは把握しておこうというつもりで最近ちょっと Bootstrap を触っていますが、ビジュアルのための HTML みたいな感じがあって CSSフレームワークはそれはそれで便利なんだけど、何か違う……感もあります。

タグ: ,

PCサイトをレスポンシブWeb化する際の悩みどころ

レスポンシブWebデザインのサイトはCSS3で拡張された media queries を利用することで容易に作成できます。しかしページを端末別に分けない手法なので、想定されるあらゆる端末で不自由なく表示するための工夫などの実装前段階での悩みどころが多いようです。

タグ: ,

擬似クラス:hover / :active / :focus

CSSを利用してロールオーバーなどの処理を実現する場合、擬似要素:hoverを活用するのが一般的ですが、訪問者の多様な環境を考慮に入れて設定するべきです。

親要素ブロックを半透明、子要素ブロックを不透明にする

ほんの最近まで携わっていた案件でサイトデザイン案のHTMLコーディングした際に遭遇した事例ですが、要は図1のような表示結果を図2のように親要素を半透明にしつつ、その子要素ブロックは不透明にしたいというケースの対応策です。

タグ: , , ,

IEでposition:absoluteがレンダリングされない

このサイトの場合、CSSをはずした時や音声ブラウザを利用する上での可読性を考慮し、ページ下に記述した署名っぽい記載をCSS適用時のヘッダーとしてページ最上部に表示するようにしてるのですが、その実現のためにHTML下部に用

タグ: