关于marquee中显示文字+图片的排版问题

lhw7791086 2012-12-12 10:21:56

实现代码如下：

<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：

...全文

326 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

lhb522 2012-12-12

打赏
举报

http://www.cnblogs.com/ywqu/archive/2010/10/30/1864875.html

xuan.ye 2012-12-12

打赏
举报

<marquee scrolldelay="1" direction="left" scrollamount=2 width=1040 height=120 onMouseOut="this.start()" onMouseOver="this.stop()"> <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 </div></marquee> 挺奇怪的，你为什么不试试呢？

lhw7791086 2012-12-12

打赏
举报

引用 1 楼 yeness 的回复:

XML/HTML code?1234567891011121314151617181920212223242526272829303132333435363738<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <style type="text/c……

这个，额。。。我想问的是在marquee中实现这种效果，就是滚动文字+图片。静态的话照着前辈的方法是可以实现的，不过在marquee中如何实现呢？marquee中可以将图片和文字放在div中，然后将该div滚动码？

xuan.ye 2012-12-12

打赏
举报

<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
    </div>
    </form>
</body>
</html>

lhw7791086 2012-12-12

打赏
举报

引用 3 楼 yeness 的回复:

<marquee scrolldelay="1" direction="left" scrollamount=2 width=1040 height=120 onMouseOut="this.start()" onMouseOver="this.stop()"> <div> <img src="http://img.my.csdn.net/upl……

问题解决了，用的是一个笨办法：插入2行n列的表，第一行放图片，将其居中显示；第二行放文字。然后直接将表甩进marquee中去，虽然由于字数的不同会造成一些高低变化，不过凑合着用应该够了。。。在这里还是谢谢你了。

lhw7791086 2012-12-12