zoukankan      html  css  js  c++  java
  • 实现文本滚动

    背景素材:

    示例代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>实现文本滚动</title>
    <style type="text/css">
    *
    {
    margin
    :0;
    padding
    :0;
    border
    :0;
    }
    #box
    {
    width
    :456px;
    height
    :291px;
    background-image
    :url(bg.jpg);
    overflow
    :hidden;
    }
    #main
    {
    width
    :360px;
    height
    :216px;
    margin-top
    :75px;
    font-size
    : 12px;
    color
    : #333333;
    line-height
    : 20px;
    margin-left
    :auto;
    margin-right
    :auto;
    }
    </style>
    </head>

    <body>
    <div id="box">
    <div id="main">
    <!--设置文本滚动方向,滚动区域宽度、高度、速率及鼠标作用效果-->
    <marquee direction="up" width="360" height="165" scrollamount="2" onmouseover="stop();" onmouseout="start();">  6月23日,对于电子竞技爱好者来说又是激动的开始,今天离WCG2006世界总决赛开始还有100开,今年的WCG将会于9月23日-10月3日(美国时间)在美国洛杉机会议中心进行,这个地方曾经举办了著名的E3游戏展,经历了去年的成功之后,今年的WCG将更令人期待。<br />
    2006年西班牙重新加入了WCG的大家庭,他们也是有着光荣的电子竞技史,西班牙上帝所在的CS和西班牙兽王Lucifron。在这100天里,世界总决赛的参赛 选手将逐渐产生,中国区总决赛将于7月24日至25日在北京进行。不同于往年,今年WCG组委会并没有设立复活赛,这样如EHOMZE、Yumiko等在分赛区马失前蹄的高手们就彻底告别了本届WCG。
    </marquee>
    </div>
    </div>
    </body>
    </html>

    效果:

    推荐一个自己业余时间开发的网盘搜索引擎,360盘搜www.360panso.com



  • 相关阅读:
    Zk学习笔记——权限控制
    guava学习笔记
    Elasticsearch学习笔记——别名
    Kafka学习笔记——存储结构
    分布式协议——Paxos、Raft和ZAB
    图解 Java 中的数据结构及原理!
    牛逼哄哄的 Lambda 表达式,简洁优雅就是生产力!
    你必须了解Spring的生态
    盘点 35 个 Apache 顶级项目,我拜服了…
    前后端分离如何做权限控制设计?
  • 原文地址:https://www.cnblogs.com/eczhou/p/2384405.html
Copyright © 2011-2022 走看看