分享

代码入门教程(5)

 春天没来 2012-10-09

第一章 代码基础知识
第八节 移动标签
“春天没来”欢迎您
   本节学习移动标签。
  移动标签是有趣的标签,移动标签是神奇的标签,移动标签是制作网页很重要的一个标签。文字、图片、边框、音画,甚至整个网页,都可以应用移动标签让它们动起来。特别是用两个移动标签控制移动内容的那些网页,其效果真是变幻莫测。移动标签,大有文章可作。在这本小册子里我所讲的移动标签内容(主要是移动标签的应用,我将在后面的文章里讲解),也只能起个抛砖引玉的作用,希望大家深入研究、大胆探讨,充分应用移动标签,制作出各种各样的具有神奇效果的漂亮网页来。
  移动标签语法:<marquee>内容</marquee> 
  注释:
  <marquee>是移动标签,</marquee>是移动尾标签,中间的“内容”,被这两个标签包围着、控制着。在<marquee>移动标签的尖括号内,我们可以给它添加属性与属值。
  移动标签常用的属性:移动方向(direction)、移动速度(scrollamount)、移动方式(behavior)、延时(scrolldelay)、对齐方式(aligh)、移动屏幕的宽(width)和高(height)等属性。
  移动方向的属值:left(向左移动)、 right(向右移动)、up(向上移动)、down(向下移动)。默认为left (向左移动)。
  移动方向的表示方法如:direction=up (等号后面的方向可替换)

  移动速度的属值是数字,数字越大移动速度越快。速度取值的大小要看你制作的网页需要的移动速度而确定。一般取值为3-4。表示方法如:scrollamount=4

  移动方式scroll(连续滚动)、slide(由一端快速滑动到另一端)、alternate(来回滚动)
  表示方法:behavior="scroll" 表示连续滚动;behavior="slide" 表示由一端快速滑动到另一端;behavior=alternate(来回滚动)
  移动屏幕的宽和高:是指显示移动内容的那个“方框”的宽度和高度。width(宽)、height(高)。表示方法:width=?px height=?px (?处输入数值)
  对齐方式表示方法:aligh=left (居左对齐)或者  aligh=right (居右对齐)或者    aligh=center (居中对齐)
  <marquee>标签的默认情况是向左滚动无数次;字幕高度是文本高度;滚动范围:水平滚动的宽度是当前位置的宽度;垂直滚动的高度是当前位置的高度。
 
        移动标签举例:
  1、文字的移动标签:
<marquee direction=up scrollamount=4>文字处</marquee>
  2、文字的移动标签:
<marquee direction=up scrollamount=4 >
<font style="line-height: normal; font-size: 30pt; font-style: normal; font-variant: normal; font-weight: normal;"
color="#ff00ff"><strong>"春天没来"欢迎您</strong></font></marquee>
  3、按照原图片的规格移动的移动标签:
  4、改变原图片的规格移动的移动标签:
<MARQUEE>
<IMG style="WIDTH: 500px; HEIGHT: 175px"
src="http://userimage2.360doc.com/12/0701/18/4127803_201207011844380474.png">
</MARQUEE>
  5、一行多列图片的移动标签:
<marquee style=
"left: 0px; width: 1340px;" height="270" behavior="alternate" scrollAmount="3">
<table style="width: 1340px;" border="0" cellSpacing="0" cellPadding="0" height="280">
<tbody>
<tr>
<td><img border="0"
src="http://image50.360doc.com/DownloadImg/2012/03/0120/21953071_6.jpg" width="500" height="270"></td>
<td><img border="0"
src="http://image50.360doc.com/DownloadImg/2012/03/0120/21953071_5.jpg" width="500" height="270"></td>
<td><img border="0"
src="http://image50.360doc.com/DownloadImg/2012/03/0120/21953071_4.jpg" width="500" height="270"></td>
<td><img border="0"
</tr></tbody></table></marquee>
        几点说明:
1、一定要牢记:任何一种标签,它们的首标签与尾标签之间的“内容”,就是这个标签所管辖、限制与修饰的对象。
2、上面的“移动标签举例1”:在首标签中设置了两个属性:移动方向(direction)和移动速度(scrollamount)。移动方向是“向上”(up ),移动速度是4;“文字处”是指你要输入的移动文字内容。这种表达方式,文字是系统默认的文字,黑色,字体比较小。
3、上面的“移动标签举例2”:在“文字处”输入了文字标签,这种文字比较美观。
4、上面的“移动标签举例3——5”都是图片的移动标签。
5、移动标签的属性与属值是往移动标签的首标签中 <marquee>添加的,尾标签 </marquee>中不能添加任何内容。
6、添加移动标签属性的顺序一般为:移动方向(direction)、屏幕高度(height)、移动方式(behavior)、屏幕宽度(width)、移动速度(scrollamount)、延时属性(scrolldelay)。
        作业:
1、认识移动标签。
2、在下面的括号内写出移动标签的属性名称:
direction()scrollamount()、()behavior、scrolldelay()aligh()、width()height()。
3、在下面的括号内写出移动标签的属值名称:
left()、 right()、up()、down()、scroll()、slide()、alternate()。
4、试着制作一篇移动文章。(提示:应用上面“移动标签举例”中的任意一例,替换文章内容或者图片地址,然后把代码复制、粘贴到撰写文章处的“代码编辑”页面中,点击“发表”按钮即可。)

2012年10月 9 日于北京

第一章 代码基础知识
第九节 链接标签
  本节讲解链接标签。
  “链接”,也叫“超链接”。
  “链接标签”是一个很重要的标签,是制作网页必不可少的一个标签。毫不夸张地说,是超级链接把整个互联网连接了起来。超级链接几乎可以指向互联网上的任何资源,例如另外一个网页、一张图片、一首MP3歌曲、一段视频等等。在一个网页中,您只要点击一下页面中超链接的内容,就可以进入链接的另一个网页。
链接标签是一个最常用的标签。你在“百度”中搜索到的每一篇文章标题,都和相关的网页相链接;我们图书馆中的每一个文件夹中的文章标题,也和相关的网页相链接;你能在互联网上任意浏览、任意收藏自己喜欢的内容,都是链接标签在起作用。
我们自己的个人图书馆,谁也想装扮的漂漂亮亮的,让更多的朋友来访问,让更多的朋友来共享,那就在你的图书馆首页,制作一个链接模块吧,把你最精美的文章放置到模块中,展示给大家吧!
  那么,怎样制作链接呢?概括地讲,就是在一个网页代码的某个部位选择一些内容(例如:文字或者图片),在它们的代码前面输入一个“链接标签”,然后在它们的代码后面输入一个“链接尾标签”,链接就制作成功了。这篇文章“发表”以后,你用鼠标箭头指向链接的那些文字或者图片,光标就会变成“手”的形状;你点击一下这些文字或者图片,就会进入相关的网页了。
  链接的基本语法为:<a href="要链接的网址" target=_blank>内容</a>
  注释:
  <a>:尖括号中的“a”是链接标签名称。
  href:用于指定超链接目标的地址。href 属性的值(即等号后面的内容)可以是任何有效文档的相对或绝对 URL(地址)。也就是说,“链接地址”可以是您的图书馆内的任何文章、任何图片的地址,也可以是您的图书馆的地址、您的朋友的图书馆地址,还可以是其它网站的任何文章等地址。
  target:链接 标签中的 target 属性规定在何处打开链接文档。_blank:链接文件的打开方式为在浏览器的新窗口中打开。(在链接标签中, target=_blank 这个代码相当重要,不能缺少。)
  内容:链接标签中的“内容”,可以是文字或者图片等内容。
  链接的形式:可以是文字和文字的链接,也可以是文字和图片、图片和图片等内容的链接。
  作业:
  1、在上面的链接标签中,指出标签名称、指出标签的属性。
  2、写出:href的意思(); target的意思();_blank的意思。
  3、试着制作一篇链接文章。在链接标签:<a href="要链接的网址" target=_blank>内容</a>中,把你的一篇“文章的地址”替换到“要链接的网址”处,“文章标题”替换到“内容”处,然后把这一小段代码复制、粘贴到撰写文章处的“代码编辑页面”中,点击“发表”,看看效果。

2012年10月 9 日于北京
 

    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多