关于marquee中显示文字+图片的排版有关问题
关于marquee中显示文字+图片的排版问题
实现代码如下:
运行后的效果如图:
现在我想实现如下的2种效果,不知道该怎么改呢?请教:
效果1:
或者效果2:
------解决方案--------------------
实现代码如下:
<marquee scrolldelay="1" direction="left" scrollamount=2 width=1040 height=120 onMouseOut="this.start()" onMouseOver="this.stop()">
<img src="img/man1.jpg" align="bottom"/>人物介绍1:XXXXXXXXXXX
<img src="img/man2.jpg" align="bottom"/>人物介绍2:XXXXXXXXXXX
<img src="img/man3.jpg" align="bottom"/>人物介绍3:XXXXXXXXXXX
<img src="img/man4.jpg" align="bottom"/>人物介绍4:XXXXXXXXXXX
<img src="img/man5.jpg" align="bottom"/>人物介绍5:XXXXXXXXXXX
<img src="img/man6.jpg" align="bottom"/>人物介绍6:XXXXXXXXXXX<br /></marquee>
运行后的效果如图:
现在我想实现如下的2种效果,不知道该怎么改呢?请教:
效果1:
或者效果2:
------解决方案--------------------
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
div
{
float:left;
width: 300px;
word-break:break-all;
word-wrap : break-word ;
margin:0 100px 0 0;
}
img
{
float: left;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<img src="http://img.my.csdn.net/uploads/201212/12/1355278674_2334.png"/>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
</div>
<div>
<img src="http://img.my.csdn.net/uploads/201212/12/1355278674_2334.png"/>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
</div>
<div>
<img src="http://img.my.csdn.net/uploads/201212/12/1355278674_2334.png"/>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX