HTML代码简介(3)

靜待_珴的陽侊

靜待_珴的陽侊

2016-02-19 17:03

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是HTML代码简介(3),一起来学习了解下吧!

  把w3c的原文放在这里并不是想吓唬任何人,只是觉得应该告诉大家学习一门语法的方法。在能力允许的范围内尽可能自己去查阅原版的官方文档,这样你不仅可以拿到最完整的信息,而且这是一个高手成长之路。翻译的东西多半掺有个人想法,以及个人能力的有限都造成这样一种局面:很难在翻译的教材里面找到完整的相关信息,从而使个人的技术水平一直停留在相对低的水平。好了废话说了一大堆就是想和大家分享学习的方法。为了照顾到一些英文水平比较低的朋友,我就简要的做些翻译解释。

  Iframe是个比较新的标识。但是从它的参数来说和普通的html标识没有什么大的区别,相

  信大家都用过frame(框架)来布局你的网页,其实iframe和frame功能一样,不同的是它是个浮动框架,你可以把iframe布置在你网页中的任何位置,包括layer层中,这种极大的自由度可以给网页设计带来很大的灵活性,所以学会使用它是非常必要的。

  下面介绍它的主要属性

  Name="" 给框架命名,这样就可以使用你的命名为链接中的target属性提供参数

  Src="" 当前框架所链接的页面地址

  Frameborder="" 浮动框架的边框大小,默认值为1显示边框,一般最好设为0不显示

  Marginwidth="" 浮动框架框边与插入页面之间空白的宽度,单位pixels

  Marginheight="" 浮动框架框边与插入页面空白的高度,单位pixels

  Scrolling="" 滚动条,有3个值:auto自动,yes 总是显示,no 不显示

  align="MIDDLE" 可选值为 left, right, top, middle, bottom,作用不大

  width=""

  height="" 浮动框架的宽及长,单位pixels。

  Noresize 浮动框架大小不可变

  其它的属性就是id ,class ,title ,style。

  举个例子:

iframe src="yoroml.htm" name="yoroml" width="252" height="875" scrolling="no" frameborder=0 /iframe

  使用Javascript制作连续滚动字幕[/COLOR]

  文/暖阳

  我们一般都用Marquee标签控制元素的滚动。但是单向的Marquee滚动是不连续的,每滚完一幕,就会出现一次空白。而下面介绍中的

  滚动则是连续的,毫不间断。

  下面小阳为你介绍这是如何实现的。

  为了滚动能够“连续”,我们需要将字幕的内容复制多遍,直到内容的高度不小于滚

  动区高度的两倍。然后我们将溢出的滚动条隐藏掉,用代码控制滚动条向下移动(这时内容将向上移动)。当滚动条滚动到最下方时,理论

  上不能再往下滚动了,于是我们立刻调整滚动条,将它向上滚动到一个和当前画面一样的位置。结果我们看到的就是连续的滚动了。呵呵

  ,说的就是这么简单,那做起来如何呢?我们看看是如何逐步实现的。

<div id="marquees" <!-- 这些是字幕的内容,你可以任意定义 -- <a href="#"链接一</a

  <br <a href="#"链接二</a

  <br <a href="#"链接三</a

  <br <a href="#"链接四</a

  <br <!-- 字幕内容结束 --

  </div

  <!-- 以下是java-script代码 --

  <script language="java-script"

  <!--

  marqueesHeight=200; //内容区高度

  stopscroll=false; //这个变量控制是否停止滚动

  with(marquees){

  noWrap=true; //这句表内容区不自动换行

  style.width=0; //于是我们可以将它的宽度设为0,因为它会被撑大

  style.height=marqueesHeight;

  style.overflowY="hidden"; //滚动条不可见

  onmouseover=new Function("stopscroll=true"; //鼠标经过,停止滚动

  onmouseout=new Function("stopscroll=false"; //鼠标离开,开始滚动

  }

  //这时候,内容区的高度是无法读取了。下面输出一个不可见的层"templayer",稍后将内容复制到里面:

  document.write('<div id="templayer"

  style="position:absolute;z-index:1;visibility:hidden"</div');

  function init(){ //初始化滚动内容

  //多次复制原内容到"templayer",直到"templayer"的高度大于内容区高度:

  while(templayer.offsetHeight<marqueesHeight){

  templayer.innerHTML+=marquees.innerHTML;

  } //把"templayer"的内容的“两倍”复制回原内容区:

  marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;

  //设置连续超时,调用"scrollUp()"函数驱动滚动条:

  setInterval("scrollUp()",10);

  }

  document.body.onload=init;

  preTop=0; //这个变量用于判断滚动条是否已经到了尽头

  function scrollUp(){ //滚动条的驱动函数

  if(stopscroll==true) return; //如果变量"stopscroll"为真,则停止滚动

  preTop=marquees.scrollTop; //记录滚动前的滚动条位置

  marquees.scrollTop+=1; //滚动条向下移动一个像素

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

  //如果滚动条不动了,则向上滚动到和当前画面一样的位置

  //当然不仅如此,同样还要向下滚动一个像素(+1):

  if(preTop==marquees.scrollTop){

  marquees.scrollTop=templayer.offsetHeight-marqueesHeight+1;

  }

  }

  --

  </script

  这样就完成了,感觉做起来也不难吧。

  如何实现Iframe透明 [/COLOR]

  tangzehuan(原作)

  第一次发表文章,有什么写不好的地方请多多包涵,另外想借此机会认识一些从事WEB设计的朋友,tangzehuan@sohu.com QQ

  37878073

  IE5.5和NN6以上的浏览器支持 Frame ,Iframe对象的allowTransparency 方法,如果某对象的背景颜色设置为Transparency的,

  它将继承包含它容器的特性。我们可以通过这个特性实现透明背景的开/关。

  代码如下:

  a.html如下:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

HTMLHEADTITLE/TITLE
META http-equiv=Content-Type content="text/html; charset=gb2312"
/HEAD
BODY style="BACKGROUND-COLOR: transparent"
H1透明文档/H1
P此IFRAME无背景颜色/P
PBODY:brBODY STYLE="background-color:transparent"/P/BODY/HTML

  b.html如下:
HTMLHEADTITLE/TITLE
META http-equiv=Content-Type content="text/html; charset=gb2312"
/HEAD
BODY style="BACKGROUND-COLOR: transparent"
H1透明文档/H1
P此IFRAME 设为绿色。/P
PBODY: brBODY STYLE="background-color:transparent"/P/BODY/HTML

  如果a.html透明的,它将继承IFRAME的背景颜色 如果容器IFRAME也是透明的,a.html将继承Iframe的父容器的颜色,如果一个对象不透

  明,它将覆盖其容器的颜色,默认是透明的。

  Internet Explorer 5.5 以上版本允许你设置透明属性,通过设置是否可被透明,你可以改变背景的颜色。[在不设置透明属性的情况下

  ,默认背景颜色为白色]

  IFRAME定义如下:
IFRAME ID="frame1" SRC="a.html" allowTransparency="true" HEIGHT=180 WIDTH=300 /IFRAME IFRAME ID="frame2"

SRC="b.html" allowTransparency="true" STYLE="background-color:#459800" HEIGHT=180 WIDTH=300 /IFRAME

  按钮定义如下:
 INPUT TYPE="button" VALUE="不透明" onclick="turnTransparencyOff()" INPUT TYPE="button" VALUE="透明"

onclick="turnTransparencyOn()"

script
//函数turnTransparencyOff():

function turnTransparencyOff()
{ document.all.frame1.allowTransparency = false; document.all.frame2.allowTransparency = false; }

//函数turnTransparencyOn():

function turnTransparencyOn()
{ document.all.frame1.allowTransparency = true; document.all.frame2.allowTransparency = true; }
/script
HTML附加命名实体[/COLOR]


Latin Extended-B
ƒ ƒ ƒ Latin small f with hook, =function, =florin, U0192 ISOtech

Greek
Α Α Α Greek capital letter alpha, U0391
Β Β Β Greek capital letter beta, U0392
Γ Γ Γ Greek capital letter gamma, U0393 ISOgrk3
Δ Δ Δ Greek capital letter delta, U0394 ISOgrk3
Ε Ε Ε Greek capital letter epsilon, U0395
Ζ Ζ Ζ Greek capital letter zeta, U0396
Η Η Η Greek capital letter eta, U0397
Θ Θ Θ Greek capital letter theta, U0398 ISOgrk3
Ι Ι Ι Greek capital letter iota, U0399
Κ Κ Κ Greek capital letter kappa, U039A
Λ Λ Λ Greek capital letter lambda, U039B ISOgrk3
Μ Μ Μ Greek capital letter mu, U039C
Ν Ν Ν Greek capital letter nu, U039D
Ξ Ξ Ξ Greek capital letter xi, U039E ISOgrk3
Ο Ο Ο Greek capital letter omicron, U039F
Π Π Π Greek capital letter pi, U03A0 ISOgrk3
Ρ Ρ Ρ Greek capital letter rho, U03A1
Σ Σ Σ Greek capital letter sigma, U03A3 ISOgrk3
Τ Τ Τ Greek capital letter tau, U03A4
Υ Υ Υ Greek capital letter upsilon, U03A5 ISOgrk3
Φ Φ Φ Greek capital letter phi, U03A6 ISOgrk3
Χ Χ Χ Greek capital letter chi, U03A7
Ψ Ψ Ψ Greek capital letter psi, U03A8 ISOgrk3
Ω Ω Ω Greek capital letter omega, U03A9 ISOgrk3
α α α Greek small letter alpha, U03B1 ISOgrk3
β β β Greek small letter beta, U03B2 ISOgrk3
γ γ γ Greek small letter gamma, U03B3 ISOgrk3
δ δ δ Greek small letter delta, U03B4 ISOgrk3
ε ε ε Greek small letter epsilon, U03B5 ISOgrk3
ζ ζ ζ Greek small letter zeta, U03B6 ISOgrk3
η η η Greek small letter eta, U03B7 ISOgrk3
θ θ θ Greek small letter theta, U03B8 ISOgrk3
ι ι ι Greek small letter iota, U03B9 ISOgrk3
κ κ κ Greek small letter kappa, U03BA ISOgrk3
λ λ λ Greek small letter lambda, U03BB ISOgrk3
μ μ μ Greek small letter mu, U03BC ISOgrk3
ν ν ν Greek small letter nu, U03BD ISOgrk3
ξ ξ ξ Greek small letter xi, U03BE ISOgrk3
ο ο ο Greek small letter omicron, U03BF NEW
π π π Greek small letter pi, U03C0 ISOgrk3

展开更多 50%)
分享

猜你喜欢

HTML代码简介(3)

Web开发
HTML代码简介(3)

HTML代码简介(1)

Web开发
HTML代码简介(1)

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

HTML代码简介(2)

Web开发
HTML代码简介(2)

HTML语言剖析(一)Html简介

Html CSS布局 Div+CSS XHTML
HTML语言剖析(一)Html简介

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

HTML5的标签的代码的简单介绍 HTML5标签的简介

Web开发
HTML5的标签的代码的简单介绍 HTML5标签的简介

替换HTML代码

电脑网络
替换HTML代码

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

[JAVA100例]062、多线程

[JAVA100例]062、多线程

滚动条CSS样式详细说明

滚动条CSS样式详细说明
下拉加载更多内容 ↓