1、新建html文档。
2、书写hmtl代码。 <!-- 横向排列 --> , <div id="nav">,<div id="box1">1</div>,<div id="box2">2</div>,<div id="box3">3</div>,</div>。
3、初始化css代码。<style>*{margin:0padding:0font-size:12pxfont-family:'Microsoft YaHei'}, </style>。
4、书写总体的css代码。
5、代码整体结构。
6、查看效果。
<style>.img-wrap{
width:300px
border:1px solid #336699
}
img{
float:left
width:92px
height:70px
}
</style>
<div class='img-wrap'>
<img src=''>
<img src=''>
<img src=''>
<img src=''>
<img src=''>
</div>
通过设置.img-wrap 宽度来显示一行图片个数
你这明显是图片路径不对, 你自己看下html里的图片路径<img src="picture/1-xxxxx.jpg">
检查下这个picture目录下是否有对应名称的图片