タグ : css

「HTML5&CSS3レッスンブック」が入門書に最適

エンジニアの新人教育に携わる機会を得たので、土日に「HTML5&CSS3レッスンブック」を読みました。

HTML5&CSS3レッスンブック

僕がエンジニアの新人研修のときに出会っておきたかったなと思えるような良い入門書です。Amazon のレビューも高評価が多いので、良書なんでしょうね。

エンジニアやデザイナーの入門書にうってつけの本が見つかってよかったです。

[CSS] 画像置換は text-indent: 100%; white-space: nowrap; overflow: hidden; でテキストを隠す

CSS で画像置換をするためのベストプラクティスっぽいの。

.hide-text { 
    text-indent: 100%; 
    white-space: nowrap; 
    overflow: hidden; 
}

昔は text-indent:-9999px; を使うのが主流だったみたいなのですが、今は上記の書き方が主流らしいです。

1点だけ注意したいのが、隠しテキストで Google からペナルティを受けることについて。

画像の内容とテキストが異なってなければ、隠しテキストの Google のペナルティは受けないみたいです。なので、関係ないテキストを画像置換するなどダメな使い方をしていなければ問題ないようです。


参考情報

[CSS] Internet Explorer(IE)で a img リンク画像の枠線を消す方法

Internet Explorer(IE) で a img リンク画像の枠線を消す方法を調べたのでメモ。

全画像の枠線を消す

画像に枠線を表示させたい場合はほとんど無いと思うので、img タグで直接指定して大丈夫だと思います。

img {
    border-style:none;
}

子孫セレクタで a 要素の子孫要素である img 要素のみ枠線を消す

a img {
    border-style:none;
}

以上です。


参考情報

小粋空間: リンク画像の枠線を消す