介绍HTML设置滚动文字marquee的相关属性

㈠文字滚动标签

设置文字滚动使用<marquee></marquee>标签,可以再标签里面设置字体的颜色,字号,字体大小等。
 
㈡滚动方向属性——direction

⑴代码写法:<marquee  direction="滚动方向">滚动文字</marquee>

⑵ “滚动方向取值”:up、down、left  和  right,其中向左滚动  left  的效果和默认效果相同。

㈢滚动方式属性——behavior

⑴ 代码写法:<marquee  behavior="滚动方式">滚动文字</marquee>

⑵取值
①默认为scroll,即循环滚动。
②当其值为alternate时,内容将来回循环滚动。
③当其值为slide时,内容滚动一次即停止,不会循环。
④ 还有一个loop属性,可设置其滚动循环次数,值是正整数,默认为无限循环。
 

㈣滚动速度属性——scrollamount

⑴代码写法: <marquee   scrollamount="滚动速度">滚动文字</marquee>

⑵在该语法中,滚动文字的速度实际上是设置滚动文字每次移动的长度,以像素为单位。scrollamount表示运动速度,值是正整数,默认为6。

㈤  滚动延迟属性——scrolldelay

⑴代码写法:<marquee  scrolldelay="时间间隔">滚动文字</marquee>

⑵ scrolldelay表示停顿时间,值是正整数,默认为0, 时间间隔单位是毫秒(千分之一秒)

㈥ 滚动范围属性——width、height

⑴代码写法:   <marquee  width=""  height="">滚动文字</marquee>

⑵如果不设置滚动背景的面积,那么默认情况下,水平滚动的文字背景与文字同高、与浏览器窗口同宽,使用  width  和  height  参数调整其水平和垂直的范围。width 属性用于设置内容滚动背景宽度。标签的height属性用于设置内容滚动背景高度。值是正整数(单位是像素)或百分数,默认width=100% height为标签内元素的高度。

㈦滚动背景颜色属性——bgcolor

⑴代码写法:<marquee  bgcolor="颜色代码">滚动文字</marquee>

⑵bgcolor表示运动区域的背景色,值是16进制的RGB颜色,默认为白色

㈧ 滚动空间属性——hspace、vspace

⑴代码写法:<marquee  hspace="水平范围"  vspace="垂直范围">滚动文字</marquee>

⑵ hspace、vspace表示元素到区域边界的水平距离和垂直距离,值是正整数,单位是像素。。

㈨元素的垂直对齐方式——align

值可以是top,middle,bottom,默认为middle

㈩鼠标滑动

⑴代码写法:onmouseover=this.stop() onmouseout=this.start()

⑵表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。

   希望有所帮助。

参考:时光·漫步zth :https://blog.csdn.net/qq_41573234/article/details/80313714

marquee跑马灯效果的相关属性的更多相关文章

  1. TextView: android:ellipsize="marquee" 跑马灯效果无效的问题

    今天练习的时候想实现一个文字的跑马灯效果,本来想自己手动实现的,不过突然想起来android里的TextView属性似乎自带了这个效果,叫: android:ellipsize ,平时都是把它的属性值 ...

  2. 自定义有焦点的TextView实现广告信息左右一直滚动的跑马灯效果

    import android.content.Context; import android.text.TextUtils; import android.util.AttributeSet; imp ...

  3. 浅谈TextView Ellipsize效果与Marquee跑马灯无效果问题

    说到TextView 效果,相信大家一定熟悉跑马灯. 先来看看 Ellipsize是什么,Ellipsize 从开发技术上翻译为省略效果.故名思议,就是当文本无法显示全部时,用什么效果来显示未显示的部 ...

  4. marquee标签实现跑马灯效果--无缝滚动

    今天在做微信端的大转盘抽奖时,想把所有用户的抽奖记录做成无缝滚动的效果,无奈我的js功底太差,一时想不出实现的方法,便百度各种相似效果.但无意中发现了一个html标签——<marquee> ...

  5. TextView标签的属性和跑马灯效果

    text:显示的内容 textSize:文本的大小 textColor:文本的颜色 visibility:可见性  默认可见,invisible:表示不可见,但对控件的显示区域做了保留 gone:隐藏 ...

  6. android:ellipsize实现跑马灯效果总结(转)

      最近无意间看到了涉及到跑马灯效果的代码,于是在网上查阅了很多资料,在这里对自己看的一些文章进行一下总结,顺便加上自己的一些体会. 让我们一步步逐渐向下. 首先我们要实现走马灯这样一个效果,通常来说 ...

  7. 【Android】TextView跑马灯效果

    老规矩,先上图看效果. 说明 TextView的跑马灯效果也就是指当你只想让TextView单行显示,可是文本内容却又超过一行时,自动从左往右慢慢滑动显示的效果就叫跑马灯效果. 其实,TextView ...

  8. android:ellipsize实现跑马灯效果总结

    最近无意间看到了涉及到跑马灯效果的代码,于是在网上查阅了很多资料,在这里对自己看的一些文章进行一下总结,顺便加上自己的一些体会. 让我们一步步逐渐向下. 首先我们要实现走马灯这样一个效果,通常来说都是 ...

  9. Android开发:文本控件详解——TextView(二)文字跑马灯效果实现

    一.需要使用的属性: 1.android:ellipsize 作用:若文字过长,控制该控件如何显示. 对于同样的文字“Android开发:文本控件详解——TextView(二)文字跑马灯效果实现”,不 ...

随机推荐

  1. 用IDEA开发Spring程序

    操作步骤 https://www.cnblogs.com/zyx110/p/11023218.html

  2. 使用feign上传图片

    1.添加依赖,支持SpringEncoder <dependency> <groupId>io.github.openfeign.form</groupId> &l ...

  3. 浅谈Linux du命令

    **du(disk usage),顾名思义,查看目录/文件占用空间大小** 1.查看当前目录下的所有目录以及子目录的大小  du -h du -ah #-h:用K.M.G的人性化形式显示#-a:显示目 ...

  4. HTML5网页文档结构

    2.1     Web标准 Web标准,使得Web开发更加容易.Web标准由万维网联盟(W3C)制定. 2.1.1          Web标准概述 Web标准的最终目的就是保证每个人都有权力访问相同 ...

  5. EM 算法(二)-KMeans

    KMeans 算法太过简单,不再赘述 本文尝试用 EM 算法解释 KMeans,而事实上 KMeans 算是 EM 的一个特例 EM 算法是包含隐变量的参数估计模型,那对应到 KMeans 上,隐变量 ...

  6. 13 UA池和代理池

    一. 下载中间件 框架图 下载中间件(Downloader Middlewares) 位于scrapy引擎和下载器之间的一层组件. - 作用: (1)引擎将请求传递给下载器过程中, 下载中间件可以对请 ...

  7. html5_禁止复制网站内容

    ```//若是你不想别人复制你的网站内容,可以把这段js代码加到你网页上,即可屏蔽鼠标右键菜单.复制粘贴.选中等 有时候的需求是网站中有些内容不希望别人复制,那么就需要用代码控制.方法有多种:第一种: ...

  8. linux下mysql忘记密码解决方案

    一.写随笔的原因:之前自己服务器上的mysql很久不用了,忘记了密码,所以写一下解决方案,以供以后参考 二.具体的内容: 1. 检查mysql服务是否启动,如果启动,关闭mysql服务 运行命令:ps ...

  9. LCD 原理和移植总结【转】

    转自:http://blog.chinaunix.net/uid-22915173-id-329617.html Framebuffer:是linux的framebuffer驱动在内存开辟的一块显存, ...

  10. 安装Maatwebsite \ EXCEL \ ExcelServiceProvider

    安装时报错 composer You can also run `php --ini` inside terminal to see which files are used by PHP in CL ...