• html内容滚动


    <marquee srolldelay="50" direction="up"></marquee>

    滚动标签<marquee>
    scrolldelay:滚动延迟时间,默认90
    direction:滚动方向,默认从右往左 down left right up

    滚动的宽度

    height:滚动的高度(两个滚动标签是否在同一平面好像依据的是它的height属性)

    例子1:

    <!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>
    
    </head>
    
    <body>
    
    <MARQUEE direction=up behavior=alternate width=60 height=120>
    <font color="#CC0066" size="+3"></font>
    </MARQUEE>
    <MARQUEE direction=up behavior=alternate width=60 height=80>
    <font  size="+3"></font>
    </MARQUEE>
    <MARQUEE direction=up behavior=alternate width=60 height=120>
    <font color="#CCFF33" size="+3"></font>
    </MARQUEE>
    <MARQUEE direction=up behavior=alternate width=60 height=80>
    <font color="#66FFFF" size="+3"></font>
    </MARQUEE>
    <MARQUEE direction=up behavior=alternate width=60 height=120>
    <font color="#33FF00" size="+3"></font>
    </MARQUEE>
    <MARQUEE direction=up behavior=alternate width=60 height=80>
    <font color="#FF00FF" size="+3"></font>
    </MARQUEE>
    
    </body>
    </html>
    View Code

    例子2:

    浮动与不浮动的区别:

    我的理解:浮动与不浮动处于不同平面,浮动的话,div相当于变成了一个行级标签,当一个左浮动的div与一个没有更改设置的div同时存在的时候,看起来会是两个div重合在一起,因为两个div所处的面不同,普通div默认对齐方式为左;两个左浮动标签在一起的时候,它们在一个平面上,所以会紧靠而不是覆盖。两个普通的div会不同行。当前面两个浮动,后面一个不浮动,不浮动的会重合第一个左浮动。

    在div的浮动使用中,如果普通div包裹两个浮动div,那么这个大div可能失去块级标签的效应,可以使用clear清除浮动消除这种不良反应

    <!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">
    .d1,.d3,.d2,.d4{
        width:300px;
        height:300px;
        border-color:#000;
        border-style:solid;
        margin:2px;
        float:left;
    }
    
    </style>
    </head>
    
    <body>
    <div>
      <div class="d1">
      <marquee direction="down" valign="top" scrolldelay="100" behavior="slide" height="300">
      <marquee direction="right" scrolldelay="100" behavior="slide" width="300">
        <img src="../image/flower8.jpg" width="100" height="100"/>
      </marquee>
      </marquee>
      </div>
      <div class="d2">
        <img src="../image/flower8.jpg" width="100" height="100"/>
      </div>
    <div>
    <div style="clear:left;">
      <div class="d3">
        <img src="../image/flower8.jpg" width="100" height="100"/>
      </div>
      <div class="d4">
        <img src="../image/flower8.jpg" width="100" height="100"/>
      </div>
    </div>
    <div style="clear:left;">
    <marquee height="100" direction="up" width="100" bgcolor="#3366cc">
    <marquee height="100" direction="left" width="100">
    <font style="font-size: 35px; color:#fff">Guo's Blog</font>
    </marquee>
    </marquee>
    </div>
    </body>
    </html>
  • 相关阅读:
    EasyNVR摄像机网页无插件直播方案H5前端构建之:通道内部搜索功能的实现方案与代码
    EasyNVR摄像机网页无插件直播方案H5前端构建之:bootstrap弹窗功能的实现方案与代码
    EasyNVR摄像机网页无插件直播方案H5前端构建之:bootstrap-datepicker日历插件的实时动态展现
    EasyNVR摄像机网页无插件直播方案H5前端构建之:如何播放HLS(m3u8)直播流
    EasyNVR摄像机网页无插件直播方案H5前端构建之:区分页面是自跳转页面还是分享页面
    EasyNVR摄像机网页无插件直播方案H5前端构建之:如何区分PC端和移动端
    EasyDSS高性能流媒体服务器开发RTMP直播同步输出HLS(m3u8)录像功能实现时移回放的方案
    Stack Overflow: The Architecture
    The week in .NET
    十分钟轻松让你认识Entity Framework 7
  • 原文地址:https://www.cnblogs.com/aigeileshei/p/5421385.html
Copyright © 2020-2023  润新知