HTML+CSS教程(三)marquee滚动效果
一.marquee
1.marquee标签的属性
scrollHeight:获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。
scrollWidth:获取对象的滚动宽度。
offsetHeight:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的高度。
offsetLeft:获取对象相对于版面或由offsetParent属性指定的父坐标的计算左侧位置。
offsetTop:获取对象相对于版面或由offsetParent属性指定的父坐标的计算顶端位置。
offsetWidth:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的宽度。
innerHTML:设置或获取位于对象起始和结束标签内的HTML
align:设置对齐方式(left左对齐;right右对齐;center居中对齐;justify两端对齐)
behavior:
设置滚动的方式(alternate表示在两端之间来回滚动;scroll表示由一端滚动到另一端,会重复;slide表示由一端滚动到另一端,不会重复。)
bgcolor设置滚动的背景颜色。
direction:表示滚动的方向,值left、right、up、down,默认left
height:设置滚动区域的高
width:设置滚动区域的宽
scrollamount:表示运动速度,值是正整数,默认为6
scrolldelay:表示停顿时间,值是正整数,默认为0
οnmοuseοut=“this.start()” :用来设置鼠标移出该区域时继续滚动
onmouseover:=“this.stop()” :用来设置鼠标移入该区域时停止滚动
注:<marquee></marquee>中间的内容可以为文字、图片、,也可以是由程序员生成的文字或图片。
例:
<marquee align="left" behavior="scroll" bgcolor="red" direction="up" width="300" height="200" hspace="50" vspace="20" scrollamount="10" scrolldelay="100" onmouseout="this.start()" onmouseover="this.stop()">
滚动的文字
程序代码
<img src="img/01.jpg"/>
</marquee>
二.
hspace:设置图像周围的空间 ,以像素为单位,指定图像左边和右边的文字与图像之间的距离。
vspace:设置上面的下面的文字与图像之间的距离的像素数。
通常图形浏览器不会在图像和其周围的文字之间留出很多的空间。除非创建一个透明的图像边框来扩大这些间距。否则图像与其周围的文字之间默认两个像素的距离,对于大多数设计者来说太近了。如果把图像放在超链接中,特殊颜色的边框会把你费尽心思留出的所有间距都占据了,而且还会使人们注意到文字与图像是多么接近。hspace和vspace属性可以给图像一个自由呼吸的空间。
浏览器支持
虽然不赞成使用align,但几乎所有的浏览器都支持
提示和注释
提示:可以在外部样式表中使用css的外边距属性和内边距属性,为站点上的所有图像这种一致的边距。与单独为一个图像设置hspace和vspace属性相比,这种方式无疑拥有更高的效率。
兼容性注释:不推荐使用img元素的hspace和vspace属性;在HTML4.01 strict以及XHTML1.0 strict DTD中,不支持img的hspace和vspace属性,请使用css代替。
HTML+CSS教程(三)marquee滚动效果的更多相关文章
- 数的n次方 s.match(reg) marquee滚动效果
一.数的n次方 <script> alert(math.pow(a,5)); /*输出a的5次方*/ </script> 二. s.match(reg); s代表一个字符串,r ...
- marquee滚动效果
转载两篇文章: http://blog.sina.com.cn/s/blog_49ce67fc0100atb4.html https://baike.1688.com/doc/view-d359560 ...
- 【css】纯css实现文字循环滚动效果
不用js来实现. html: <div class="box"> <p class="animate"> 文字滚动的内容文字滚动的内容文 ...
- div+css关于overflow 动态滚动效果
http://www.ablanxue.com/prone_2613_1.html 关于overflow:hidden不起作用的说明
- jQuery+CSS实现的图片滚动效果
http://www.helloweba.com/view-blog-139.html
- fullPage教程 -- 整屏滚动效果插件 fullpage详解
1.引用文件 [html] view plain copy print?在CODE上查看代码片派生到我的代码片 <link rel="stylesheet" href=&qu ...
- iframe框架里镶嵌页面;<marquee>:滚动效果;<mark>做标记;内联、内嵌、外联;选择器
标签:①②③④⑤⑥⑦★ 框架: 一.frameset:(框架集) 1.如果使用框架集,当前页面不能有body 2.cols="300,*":左右拆分,左边宽300,右边宽剩余 3. ...
- css设置背景固定不滚动效果的示例
css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...
- HTML标签marquee实现滚动效果
html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制.使用marquee标记不仅可以移动文字,也可以移动图片,表格等.只需要在<ma ...
随机推荐
- effective-java学习笔记---使用接口模拟可扩展的枚举38
枚举类型( BasicOperation )不可扩展,但接口类型( Operation )是可以扩展的,并且它是用于表示 API 中的操作的接口类型. // Emulated extensible e ...
- 【Springboot】实例讲解Springboot整合OpenTracing分布式链路追踪系统(Jaeger和Zipkin)
1 分布式追踪系统 随着大量公司把单体应用重构为微服务,对于运维人员的责任就更加重大了.架构更复杂.应用更多,要从中快速诊断出问题.找到性能瓶颈,并不是一件容易的事.因此,也随着诞生了一系列面向Dev ...
- 面向对象(OO)第一阶段学习总结
前言:对OO本阶段作业情况说明 本阶段一共完成三次作业,第一次主要是在主方法里面进行编程,也就是和之前C差不多,而随着学习的深入,慢慢了解到面向对象与面向过程的区别.作业的难度也在慢慢增大,后两次都用 ...
- 记一次Task抛异常,调用线程处理而引发的一些随想
记一次Task抛异常,调用线程处理而引发的一些随想 多线程调用,任务线程抛出异常如何在另一个线程(调用线程)中捕获并进行处理的问题. 1.任务线程在任务线程执行语句上抛出异常. 例如: private ...
- O - 推箱子 HDU - 1254(bfs_box + bfs_man)
O - 推箱子 HDU - 1254 推箱子是一个很经典的游戏.今天我们来玩一个简单版本.在一个M*N的房间里有一个箱子和一个搬运工,搬运工的工作就是把箱子推到指定的位置,注意,搬运工只能推箱子而不能 ...
- python:列表生成式的学习
看个例子: # 定义一个列表 l=[1,2,3,4,5] #()用于创建一个list,结果依次返回列表l的元素的平方,返回list s=[i*i for i in l] # 打印列表s print(s ...
- JavaScript布尔操作符
布尔操作符 逻辑与 (&&) 逻辑与操作可以应用于任何类型的操作数,当有一个操作数不是布尔值的情况下,逻辑与操作就不一定返回布尔值 如果第一个操作数是对象,则返回第二个操作数 如果第二 ...
- Python内置函数分类汇总
Python解释器内置了很多函数,这些内置函数使用方便,无需导入,直接调用.可以在交互模式下输入dir(__builtins__),输出的列表中包含了所有的内置函数: 1.可迭代对象.序列操作相关 ...
- 分享一下,PHP实现第四方QQ微信扫码登陆,不接入qq互联以及微信开发者平台就可以实现用户对接鹅厂,phpQQ微信扫码登陆
自己抓的QQ包以及整合了网上一些已经封装好了的代码具体如下:QQ: <?php class QQ extends Curl_Api { //获取登录验证码 public function QRc ...
- python 面向对象反射以及内置方法
一.反射 什么是反射:可以用字符串的方式去访问对象的属性,调用对象的方法(但是不能去访问方法),python中一切皆对象,都可以使用放射. 反射的四种方法: hasattr:hasattr(objec ...