CSSイメージギャラリー

CSSを使用して画像ギャラリーを作成します:

を以下に示します

      
  
  
1
 
 
  
2
 
 
  
3
 
 
  
4
 
  

コードの説明:

CSS イメージ ギャラリー表示される各画像に対して 2 つの div レイヤーを使用します。タグ内のタグは、画像のパスを設定します。ヒント; 内側の div には画像の説明が表示され、その CSS クラスは

div.img で、「img」クラスの属性を定義します。 2px;
ボーダー: 1px、実線、色;
幅: 自動;
テキストを中央に配置;
inline要素;独自の独立したスペースであり、他のブロックにアタッチされます。 Level 要素が存在するため、インライン要素の高さ、幅、内側と外側のマージンなどの属性の設定は無効です。
Margin: 3px;
Border: 1px、実線、色;



div.desc

テキスト配置: 中央配置フォントウェイト: 標準幅: 120px
マージン: 2px

div.img a:hover img {border: 1px Solid #0000ff;}

マウスオーバーでimg 枠線と色が変わります