一.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滚动效果的更多相关文章

  1. 数的n次方 s.match(reg) marquee滚动效果

    一.数的n次方 <script> alert(math.pow(a,5)); /*输出a的5次方*/ </script> 二. s.match(reg); s代表一个字符串,r ...

  2. marquee滚动效果

    转载两篇文章: http://blog.sina.com.cn/s/blog_49ce67fc0100atb4.html https://baike.1688.com/doc/view-d359560 ...

  3. 【css】纯css实现文字循环滚动效果

    不用js来实现. html: <div class="box"> <p class="animate"> 文字滚动的内容文字滚动的内容文 ...

  4. div+css关于overflow 动态滚动效果

    http://www.ablanxue.com/prone_2613_1.html 关于overflow:hidden不起作用的说明

  5. jQuery+CSS实现的图片滚动效果

    http://www.helloweba.com/view-blog-139.html

  6. fullPage教程 -- 整屏滚动效果插件 fullpage详解

    1.引用文件 [html] view plain copy print?在CODE上查看代码片派生到我的代码片 <link rel="stylesheet" href=&qu ...

  7. iframe框架里镶嵌页面;<marquee>:滚动效果;<mark>做标记;内联、内嵌、外联;选择器

    标签:①②③④⑤⑥⑦★ 框架: 一.frameset:(框架集) 1.如果使用框架集,当前页面不能有body 2.cols="300,*":左右拆分,左边宽300,右边宽剩余 3. ...

  8. css设置背景固定不滚动效果的示例

    css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...

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

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

随机推荐

  1. 在TensorFlow中实现文本分类的卷积神经网络

    在TensorFlow中实现文本分类的卷积神经网络 Github提供了完整的代码: https://github.com/dennybritz/cnn-text-classification-tf 在 ...

  2. 【springmvc thymeleaf】springmvc整合thymeleaf

    概述 Thymeleaf提供了一组Spring集成,使您可以将其用作Spring MVC应用程序中JSP的全功能替代品. 这些集成将使您能够: @Controller像使用JSP一样,将Spring ...

  3. iOS 项目优化

    前言 iOS性能优化系列篇之"优化总体原则" 不要提前过度优化 要找到性能瓶颈 要在不同性能指标间权衡 要理解优化任务的底层运行机制 要有技术保障体系 一.启动速度优化 1.1 学 ...

  4. 有效括号算法题(Golang实现)

    有效括号算法题 给定一个只包括 '(',')','{','}','[',']' 的字符串,判断字符串是否有效. 有效字符串需满足: 左括号必须用相同类型的右括号闭合.左括号必须以正确的顺序闭合.注意空 ...

  5. LLVM 编码规范 - 中文翻译

    LLVM 编码规范 导论 语言.库和标准 C++ 标准版本 C++ 标准库 Go 代码准则 机械的代码问题 代码格式化 注释 头文件 类概述 method information 注释格式化 使用Do ...

  6. [vijos1574]摇钱树<dp+贪心>

    题目链接:https://vijos.org/p/1574 这道题是昨晚一个叫Ztravellers的大佬推荐的,确实觉得这是一道很有意思的题,很多方面都很有意思: 初见这道题,估计想法都是贪心,因为 ...

  7. 宝塔phpmyadmin可能问题及解决方法

    1. 端口问题检查宝塔phpmyadmin的默认端口888是否放行,和在服务器的安全组规则有没有添加888端口 2.phpmyadmin的php版本问题 在phpmyadmin的设置里的版本选择php ...

  8. 相见恨晚的 Git 命令动画演示,一看就懂!

    虽然 Git 是一个强大的工具,但是我觉得大部分人都会同意我说的:它也可以是一个--噩梦!我一直觉得,使用 Git 的时候把操作过程在脑海里视觉化会非常有用:当我执行某个命令的时候,分支之间是如何交互 ...

  9. Flutter 完美的验证码输入框

    老孟导读:刚开始看到这个功能的时候一定觉得so easy,开始的时候我也是这么觉得的,这还不简单,然而真正写的时候才发现并没有想象的那么简单. 先上图,不上图你们都不想看,我难啊,到Github:ht ...

  10. C. Yet Another Walking Robot Round #617 (Div. 3)()(map + 前后相同状态的存储)

    C. Yet Another Walking Robot time limit per test 1 second memory limit per test 256 megabytes input ...