海丰国际

海丰国际是一个示例网站，使用了CSS样式来创建一个滑动效果的背景图片。以下是该网站的CSS样式和结构：

```css
/* 本例子css左 */
.m-slide {
position: relative;
width: 242px;
height: 310px;
border-left: 1px solid #e9e9e9;
border-right: 1px solid #e9e9e9;
background: #fff;
}

.m-slide .bottom-shadow {
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
height: 1px;
overflow: hidden;
border-top: 1px solid #e0e0e0;
background: #e6e6e6;
border-bottom: 1px solid white;
}

.m-slide .img {
float: left;
position: relative;
margin-left: -9px;
margin-top: -6px;
}

.m-slide .img li, .m-slide .img ul {
list-style: none;
}

.m-slide .img .image-container {
display: none;
}

.m-slide .img .image-container img {
max-width: 100%;
width: auto;
height: auto;
margin-bottom: 5px;
}

以上代码展示了一个简单的网页布局，使用CSS实现了一个滑动背景图片的效果。.m-slide类用于定义页面的主体部分，包括边框、阴影等样式。每个.m-slide元素中包含一个.img类的列表项或无序列表项，用于展示图片。.image-container类用于隐藏默认显示的图片，当鼠标悬停时显示。.image-container img类用于设置图片的宽度和高度等属性。