Posts tagged XHTML

imgタグの画像を背景画像として表示

背景画像だけを表示したいけど空divを使うのはちょっと・・・という場合に使えるテクニックを紹介します。

使うタグはimgタグのみ。ただし、imgタグのsrcには1x1pxの透過GIF画像を指定します。そしてCSSでそのimgタグに背景画像を指定します。

img.bgimg {
  background: url("path_to_img") no-repeat;
}

幅や高さはXHTMLで指定してください。これで背景画像として表示できます。CSSで画像を指定できるので、最近流行の CSS Sprite も使えます。

普通の画像 背景画像で
star(normal) star(using the technique)

中身がないタグで怒られないための現実逃避法

XHTMLで中身がないタグを書くと、構文の検証サービスで中身がない、と怒られます。例えば、


のようなタグです。

しかし、エラーから逃げる技を見つけてしまいました。それは・・・

style="display:none" />

style="display:none" />

当然ながら、
タグは改行のためのものであり、このような使いかたは想定外だと思われます。書いといてなんですが、私は推奨しません・・・。

ただ、絶対エラー出したくない!などの場面では使えないこともないような気もしないでもないです。

XHTMLのタグのクラスの多重指定

XHTMLのタグにはclass要素でクラスを指定できますが、半角スペースで区切って指定すると、複数のクラス名をつけて複数のスタイルを適用することができます。

class="cls1 cls2 cls3">example…

このように指定します。

意外と知らなかったのでメモ。

Go to Top