web div+css

使用JavaScript实现一行文字在网页底部从右到左循环滚动的效果,当把鼠标放至滚动文字中则文字暂停滚动,当把鼠标移出文字范围则文字继续滚动。(提示:采用marquee标签实现文字滚动,direction属性设置为left,width属性设置为100%;所有文字全部写在一行,不要多行,文字颜色为红色,文字大小设置为20px;可以用之前学过的Div+CSS布局方法将滚动文本设置到网页底部

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文字循环滚动效果</title>
    <style type="text/css">
        #container {
            width: 100%;
            margin: 0 auto;
            text-align: center;
        }
    </style>
    <script type="text/javascript">
        window.onload = function() {
            var marquee = document.getElementById("myMarquee");
            marquee.onmouseover = function() {
                this.stop();
            };
            marquee.onmouseout = function() {
                this.start();
            };
        };
    </script>
</head>
<body>
    <div id="container">
        <marquee id="myMarquee" direction="left" width="100%" style="color: red; font-size: 20px;">
            这里是滚动文字!这里是滚动文字!这里是滚动文字!这里是滚动文字!这里是滚动文字!这里是滚动文字!这里是滚动文字!
        </marquee>    
    </div>
</body>
</html>