HTML/CSSテクニック 一覧
画像をロールオーバーさせるとき、ロールオーバー後の画像は明るくなるだけ、ってよくありますよね。そのくらいであればCSSで簡単に実現できるので、ご紹介します。これで簡単なロールオーバー後の画像を作る必要がなくなった！！
HTML5の仕様そのものは確定したわけではないため、対応していないWebブラウザも多く使われています。Internet Explorerとか！HTML5でマークアップをする場合、未対応のブラウザにも対処する必要があります。主にIEとか（略称になった）
連続した<br>がIE6では1つの<br>として表示されることがあります。例えば、文章の行間を1行分空けたいときなどに<br>を2つ指定したりしますが、ある条件が重なるとIE6では1つとして認識されてしまいます。
コーディングしているときに、背景や線が途中で消えたり、floatした親要素のマージンがおかしくなることがあると思います。
これは、floatした要素が親要素の高さに反映されていないため起きる現象です。つまり、親要素の枠に対して子要素は独自に高さを持ったりしてるため、親要素の枠をはみ出したりするんですね。
clearfixはこういった現象を解決するための方法です。
携帯サイトを構築するとき、キャリア毎の分岐などがHTMLだと非常に面倒くさいので僕の場合はPHPで構築します。わかりにくいタイトルでごめんなさい。
各キャリアで使用できるタグや、セレクタにも差があり、特にDocomoなんかは拡張子をxhtmlにするとCSSが上手く適用される（解釈の違いはあると思いますが...）とか、CHTMLの独自の仕様があったりとコーダー泣かせ。もう辛抱たまらん。
みなさんは利用規約などでpreタグを使っていますか？
preタグで囲ったテキストは自動改行されないため、文章量が多いとコンテンツ領域を越えてしまったりします。
越えないように overflow: auto などを指定するのですが、利用規約などをpreでマークアップしたときにはちょっと見難いものになってしまいます。
縦横にスクロールバーが出てしまい、見る側にとって非常に確認しにくい...。
ブラウザ間の表示を統一するためにはCSSハックが必要不可欠です。
CSSハックにはチェッカーを通らないものや、様々な障害を作り出す可能性があります。
但し、うまく付き合えばコーディング業務もぐんと楽になります。
ここではよく扱うCSSハックを紹介していきます。
XML宣言は必ず付けなければならない、ということはありません。チェッカーを通すときにXML宣言をしていなければ引っ掛かってしまいますが、それ以外のデメリットは極論を言えばほとんどありません。
逆に、XML宣言を行うことによって様々なデメリットが発生することを覚えておかなければなりません。
できればXML宣言を行うほうが形式的には正しいと言えるのですが現在のところ「XML宣言を行わなくても文法的に間違いではない」ということを覚えておきましょう。
宮城県仙台市在住のWebデザイナーです。Webデザインからコーディング、SEO対策とかもうWeb制作に関わることはなんでもやっちゃいます。