CSS image horizontal arrangement implementation code_image special effects

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>CSS image list, landscape</title> <style type="text/css"> <!-- * { margin:0; padding:0; font-size:12px; text-decoration:none; } #products { width:560px; margin:50px auto; } #products li { width:110px; height:154px; float:left; margin-left:30px; display:inline; } #products li a { display:block; } #products li a img { border:1px solid #666; padding:1px; } #products li span a { width:110px; height:30px; line-height:24px; text-align:center; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; } --> </style> <ul id="products"> <li> <a href="#"><img src="http://files.jb51.net/upload/2010-3/20100303232223253.jpg" alt="" style="max-width:90%" style="max-width:90%"></a> <span><a href="#">VB scheduled shutdown source code example</a></span> </li> <li> <a href="#"><img src="http://files.jb51.net/upload/2010-3/20100303232225693.jpg" alt="" style="max-width:90%" style="max-width:90%"></a><span><a href="#">A useful C log generation class</a></span> </li> <li> <a href="#"><img src="http://files.jb51.net/upload/2010-3/20100303232225439.jpg" alt="" style="max-width:90%" style="max-width:90%"></a> <span><a href="#">JS CSS jointly creates a dynamic menu combining graphics and text</a></span> </li> </ul>