2008年7月

img要素のデザインをCSSでいろんなパターン装飾してみる

今回のサンプルで使う画像です。

例えば、企業系のWebサイトとかで、商品画像とか、イメージ画像とかって使う機会ってけっこうあると思うんですが、ただ画像をおくだけでは寂しいですよね...

この時にimg要素に薄い色のborderを入れてあげるだけでけっこう綺麗になると思うですよね。

なので今回はimg要素のデザインをいろんなパターン作ってみたので、参考にしてみて下さい。

TableをCSSでデザインするいろんなパターンのまとめ

tableタグを使う機会ってそう多くないと思うですが、料金表とか組む時はtableタグを使うのが一番だと思います。

ここで本題なんですが、自分は料金表などのデザインのバリエーションがうとく、何時も同じようなパターンになってしまうんですよね...。
なので今回は料金のデザインのパターンと、それをCSSで組むやり方の両方を紹介してくれるサイトをまとめました。

アーカイブページを分割するプラグイン Paginate

このPaginateプラグインの利用はHTMLをPHP化にする必要があるんですが、ブログをPHP化しても、今まで通りファイルは検索エンジンにインデックスされますし、PHP化することによりいろんな機能を付加することができたりもしますよ。

ネガティブマージンを使ってレイアウトしてみる

ネガティブマージン使用例

↑の画像のようなレイアウトってよく使われていると思うですが、こういうレイアウトをネガティブマージンを使う事でソース上も綺麗に収まりますし、使いけっこう使いがってもいいのでオススメしたいと思います。

page top へ

Sponsor

  • heteml
  • Movable Type

Category

Recent Article

2011 04-05
iPhone スマートフォンサイトのデザインのまとめ
2011 04-04
スマートフォン対応にしてみました
2011 04-01
CSS3 要素を透明に出来る Opacity と RGBa の使い方
2011 03-31
サイトリニューアルしました
2010 12-01
CSS3 でボタンを作る為のテクニック、サンプル集
2010 11-24
綺麗でリッチなフッターデザイン集のまとめ 60
2010 11-18
緑と黒色を使った Webデザインのサイト 25
2010 11-10
知っておいた方が便利なエクセルの知識

Recent Comments

Archive

2011年
2010年
2009年
2008年