HTML marquee

跑马灯

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/marquee

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMarqueeElement

https://developer.cdn.mozilla.net/zh-CN/docs/Web/HTML/Element/marquee

https://www.tutorialspoint.com/html/html_marquees.htm


<marquee>This text will scroll from right to left</marquee> <marquee direction="up">This text will scroll from bottom to top</marquee> <marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid">
<marquee behavior="alternate">
This text will bounce
</marquee>
</marquee>

This text will scroll from right to left

This text will scroll from bottom to top

This text will bounce

demo

https://api.cmsfg.com/app/hospital/600100/index.html#/HospitalHome?AppId=600100


css animation

marquee


marquee {
width: 450px;
line-height: 50px;
background-color: red;
color: white;
white-space: nowrap;
overflow: hidden;
box-sizing: border-box;
}
.marquee p {
display: inline-block;
padding-left: 100%;
animation: marquee 15s linear infinite;
}
@keyframes marquee {
0% { transform: translate(0, 0); }
100% { transform: translate(-100%, 0); }
}

https://stackoverflow.com/questions/31951282/why-is-marquee-deprecated-and-what-is-the-best-alternative


HTML marquee的更多相关文章

  1. marquee上下左右循环无缝滚动代码

    一.横向滚动<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN "><HTML>< ...

  2. marquee实现文字移动效果;js+div实现文字无缝移动效果

    1.marquee实现文字移动: <marquee width="220px;" scrollamount="5" onmouseover="t ...

  3. TextView属性android:ellipsize="marquee"不生效的解决办法

    最近自己在写自己的第一个app,过程中遇到了这个问题,查了不少帖子,经过尝试发现,这种问题一般分为两类: 1. TextView的Text值赋值后不更改,很多帖子上说如下写法就可以生效: <Te ...

  4. marquee标签,好神奇啊...

    <html><body><div style="height:190; margin-top:10; margin-bottom:10; width:96%; ...

  5. Marquee 滚动参数

    new marquee("Layer3", 2, 1, 989, 68, 20, 0, 0, 238); 参数说明:Layer3 :容器ID 2 :向上滚动(0向上 1向下 2向左 ...

  6. HTML标签marquee实现滚动效果

    html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制.使用marquee标记不仅可以移动文字,也可以移动图片,表格等.只需要在<ma ...

  7. marquee 标签 文字滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. marquee标签实现页面内容的滚动效果

    页面的自动滚动效果,可由javascript来实现, 但是有一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 使用marquee ...

  9. marquee 实现首尾相连循环滚动效果

    <marquee></marquee>可以实现多种滚动效果,无需js控制.使用marquee标签不仅可以滚动文字,也可以滚动图片,表格等  marquee标签不是HTML3.2 ...

  10. 一个不陌生的JS效果-marquee,用css3来实现

    关于marquee,就不多说了,可以戳这里. 毕竟他是一个很古老的元素,现在的标准里头也不推荐使用这个标签了.但平时一些项目中会经常碰到这样的效果,每次都是重新写一遍,麻烦! JS类实现marquee ...

随机推荐

  1. LOJ10129

    AHOI 2009 老师交给小可可一个维护数列的任务,现在小可可希望你来帮他完成. 有长为 nn 的数列,不妨设为 a1​,a2​,⋯,an​.有如下三种操作形式: 把数列中的一段数全部乘一个值: 把 ...

  2. 基于navicat的数据库导入导出

    1.右键当前数据库,选择转储SQL文件 选择导出sql的存放路径 2.新建统一命名的数据库,右键运行SQL文件 3,.选择要导入的SQL文件后如图

  3. wmi_exporter+Prometheus+Grafana

    wmi_exporter+Prometheus+Grafana 原文地址: CSDN:NRlovestudy:Windows 下搭建 wmi_exporter+Prometheus+Grafana 服 ...

  4. jvm系列四类加载与字节码技术

    四.类加载与字节码技术 1.类文件结构 首先获得.class字节码文件 方法: 在文本文档里写入java代码(文件名与类名一致),将文件类型改为.java java终端中,执行javac X:...\ ...

  5. cassandra权威指南读书笔记--cassandra概述

    cassandra是一个开源的.分布式.去中心化.弹性可扩展.高可用.容错.可调一致性.面向行数据库,分布式设计基于Amazon Dynamo,数据模型基于Google BigTable.cassan ...

  6. Flink-v1.12官方网站翻译-P013-Timely Stream Processing

    及时的流处理 介绍 及时流处理是有状态流处理的一种扩展,其中时间在计算中起着一定的作用.其中,当你做时间序列分析时,当做基于某些时间段(通常称为窗口)的聚合时,或者当你做事件处理时,事件发生的时间很重 ...

  7. CF 1326 D. Prefix-Suffix Palindrome

    D. Prefix-Suffix Palindrome 题意 给一个字符串 s,求一个字符串 t,t 由 s 的某个前缀以及某个后缀拼接而成,且 t 是回文串,长度不能超过 s.输出最长的 t 分析 ...

  8. Codeforces Round #604 (Div. 2) A. Beautiful String(贪心)

    题目链接:https://codeforces.com/contest/1265/problem/A 题意 给出一个由 a, b, c, ? 组成的字符串,将 ? 替换为 a, b, c 中的一个字母 ...

  9. gym101002K. Inversions (FFT)

    题意:给定一个仅含有AB的字母串 如果i有一个B j有一个A 且j>i 会对F(j-i)产生贡献 求出所有发Fi 题解:好像是很裸的FFT B的分布可以看作一个多项式 同理A也可以 然后把B的位 ...

  10. hdu1541 Stars

    Problem Description Astronomers often examine star maps where stars are represented by points on a p ...