Html的几个小技巧.docx

1、Html的几个小技巧Html的几个小技巧发表时间：2004-8-28 22:03:26来源：网页制作学习园地 点击 4104 次 虽然现在有许多网页制作工具能让您轻松地完成工作,但如果使用HTML则可以得到更大控制权,下面介绍几个小技巧.1.使用,语句来控制文字排版比用好得多. 如: 实用网络曾伟滨2.不要用800*600的分辨率来制作网页,当浏览者用640*480看网页时,不旦会使速度减慢,还会使网页图像和文字出现错位.当然,也可以使用帧,水平控制,表格等标识语句来取代己设定的象素,但就增加了工作量.3.使用只有一行,而使用就会多了空白的一行.4.使用16进制数来定义网页的颜色,而不要用re

2、d,black等语句,才能够充分利用Web调色板的216种色彩(另外的40种,一般人难以分辨).5.在中加上就可以使你的网页不至于在帧链接到他处时缩小,或者用打开一个新窗口.6.用来按制就能够让许多浏览器都可以看到表格居中的效果,如果您用的是Netscape 4.0也可以加入align=center来代替它.7.HMTL中的四个特殊字符(,&,)是不能直接写在文件中的,必须用后面的语句来替换, => &=& ="(英文字母一定要小写)8.一些语义格式的字体效果,标题的斜体字,显示源程序的宽体字,强调用的斜体字,要求键盘输入的宽体字,状态表示的宽体字,强调的粗体字,构造变

3、量的斜体字 HTML编写小经验发表时间：2004-8-28 22:02:12来源：网页制作学习园地 点击 1571 次 在用HTML(HyperText Markup Language，超文本链接标示语言)语言编写Web页面时，由于所用的Web浏览器对HTML支持的程度不同，常常会在HTML语言的运用上产生一些疑问。在此，笔者将学习和实践中获得的几点经验奉献给大家，以供参考。 HTML中的几种常用特殊符号： 符号替代指令 (大于符号)gt (与符号)amp (双引号)quot 不可分的空格 nbsp 其中，不可分的空格是指两个单词有时会因版面关系而分成两行，此时如果将两个单词之间的空格替代为n

4、bsp，则它们将总是在一行中。 例1：在HTML中，语句 AB31 (显示为AB31) 应写为 ABltC 3gt1 (显示为AB1) 例2：符一般不使用，只要不产生歧义，就不必用amp替代。如： if (ac)可用语句 if (altbbgtc)表示，而不必用 if (altbampampbgtc)表示。 lt则必须用语句amplt表示，而不能用lt表示(显示为)。 例3：替代指令中的英文字母在HTML语句中的大小写必须统一，即或者均为大写，或者均为小写，而不能大小写混合。如： 符可用LT或lt表示，而不能用Lt或lT表示。 笔者所使用的是Netscape Navigator 3 0，在Wi

5、ndows 3 1环境中运行。 HTML4.0的 Access Key发表时间：2004-8-28 22:00:35来源：网页制作学习园地 点击 644 次 例程1:通常我们在制作form表单时，实现聚焦一般得用鼠标在form框中点选，下面的例子都是用HTML4.0实现的，象windows菜单一样，首字符有下划线，用“ALT+首字符”就可以降光标定位在form框内了。代码是这样的：Name: Email: Phone: Suggest .标签产生下划线；For=Name和ID=Name中的Name是一致的。ACCESSKEY=. 设置“热键”。例程2:看看下面的选择框范例，它的微妙之处在于，选

6、择项目时不必非得在框内点击鼠标了，在文本上选择即可。不信试一试吧。经常来这里 偶尔来看看 完整的HTML文件发表时间：2004-8-28 21:59:35来源：网页制作学习园地 点击 1841 次 INTERNET的迅猛发展，让许多软件公司看到了无限的商机，纷纷开发出各种主页制作软件。为了让读者了解这些软件的特性，在学HTML代码的过程中也学会使用一些合适的工具，现在我们就来建立一个介绍主页制作软件的网站，讲解网站制作。index.html主页制作软件介绍 输入上面的代码，存盘。因为这一页是我们网站的首页，我们想浏览者输入我们的网址后，就显示这一页的内容，所以我们把这个文件设为默认文档，文件名

7、为index.html，也可为index.htm。字体和段落 FONT, PRE, STRONG, EM, B, I, Hx, P段落 现在加入一些实质性的内容。在和之间加入： 如果愚公有推土机的话，也许到他孙子那辈，就可以把太行、王屋二山移走了，不必等到“子子孙孙，无穷尽矣”。同样，虽然用记事本就可以写出主页来，但是好的主页制作软件却可以让你工作起来轻松自如，事半功倍。 去yahoo查找一下主页制作软件（HTML EDITOR），其结果让人目瞪口呆。INTERNET所蕴藏的无尽商机让众多软件开发商蜂拥而上，极力争取分一勺羹。庆幸的是，这些软件一般都是可以免费得到或试用的，你可以试用几个，从中

8、发现符合你的要求的软件。这当然要花一些时间，包括那段揪人肺腑的需要付费的上网下载时间。 本站主要介绍几个当前流行的主页制作软件，对比它们的优缺点，帮助读者选择自己的软件。源代码应该是： 还记得小学语文老师的话吗？“当文章的内容出现变化时，要另起一段；段落的开头空两格。”显然这篇用HTML作的文章要不及格的。怎么会这样？原来，HTML忽略源代码里面的回车和连续空格，而必须用专门的标记安排段落格式。 段落的标记是，中间是一段的内容。可以省略，因为HTML碰到下一个就知道另起一段了。 在每一段的开头加上。P的属性 P的一个基本属性是ALIGN（对齐），可以有LEFT（左）、CENTER（中间）、RI

9、GHT（右）几个值，默认值是LEFT。左对齐段落。居中段落。右对齐段落。空格 空格是一个特殊字符。HTML用&加字符串表示一些特殊字符。空格是“  ”。 一个汉字要占2个英文字符的大小，空2个汉字的位置就需要加4个“  ”。 现在的效果就比较满意了。特殊段落 PREADDRESSHR标题 虽然读者可以根据浏览器标题栏显示的TITLE里的内容，知道你的主页的标题。但是由于内容大多在浏览器窗口的客户区内，所以在BODY部分加上一个标题，可以让人一目了然。 紧跟着加上一句： 主页制作软件介绍 标题的字自然要大一些，就像MICROSOFT WORD里为标题专门定义了几个格式一样，H

10、TML有几个标记是定义标题字体大小的，即，其中x的取值可以从1到6，总共有6级。标题1标题2标题3标题4标题5标题6 不必添加，里的文字都是自成一段。而且，Hx标记也有ALIGN属性，其设置和一样。 现在把标题设置成H1的格式，即： 主页制作软件介绍换行 你可以看到，在有的地方，HTML空了一行的位置，然后再开始下一段。如果我想写一首诗或一段歌词，就要在一个段落里换行，这样的间隔就太大了。可以用来实现，如：静夜思床前明月光，疑是地上霜。举头望明月，低头思故乡。 我们来考虑一下另外一个极端。这首诗的一行比较短，而有些歌词的一行可能要很长。当浏览器的宽度达不到时，就会自动换行。而我不想这样，我想保

11、证这一行在同一行内显示，即使浏览器需要水平滚动条。只要把这一行用包含起来就行了。静夜思床前明月光，疑是地上霜。举头望明月，低头思故乡。 如果希望在对里几个固定的地方可以换行，可以用。静夜思床前明月光，疑是地上霜。举头望明月，低头思故乡。 当窗口宽度足够宽时，这四句诗在一行里显示。如果不行，就会在有的地方换行，这样就可以保证每句诗在一行里。 动态HTML教程（二）发表时间：2004-8-29 11:07:50来源：网页制作学习园地 点击 1004 次 动态HMTL网页利用串接样式表布局，并利用Javascript控制网页元素。实际并不复杂或有很多的规定。我们所需要作的只是要给网页加入样式，能使其

12、运动，并且在两种主要的浏览器中都能正确显示。 精通我们将用CSS-P布局网页，这是学习动态HTML的第1步。学习完定位元素之后，我们将接着学习编写使其动态显示的脚本。 大多数用于设计和页面布局的程序或文件格式必须现生成box，它们的宽度和高度可以改变，它们还能使你控制将对象叠放在对象之上。 CSS-P的原理与其相似，你先用HTML定义一个容器（为了便于具备跨平台应用的兼容性，你最好实用或标签），设置其水平和垂直位置，然后设定哪个对象应该叠放在哪个对象之上。 真的很简单，它能象大多数人（尤其那些利用表格定位和布局的人）希望的那样让HTML发挥功能。你只需以一种不同的思维角度来思考网页的布局，本教

13、程将重点讲述一些基本的布局技巧明天我们将利用Javascript控制你的网页布局。 动态HTML中大多数的内容都要用到标签作为容器。(在 串接样式表和CSS定位的规范草案中规定可以将任何对象 定位，但Netscape的浏览器还不支持这项规定。所以你必须 用标签作为类属容器），在容器内加入对象然后再 定位。 我们先为本教程中的范例生成一个box。在本教程的范例中 我们将用网猴的一个编辑Tim作为范例中的主角： dramatis personae 这里是box的显示结果（为了辨认的方便，我给它加了一个 红色边框） 现在我们有了一个空的box，其ID名称为tim，其位置在距窗 口左边10个像素，距窗

14、口顶部10个像素的位置。现在它还没 有体现出动态HTML的魅力，所以我们在这个box中填入Tim的 图片，并给它加一点说明： Tim, the hero. Webmonkey editor and resident banjo-picker. 在3.2版本的HTML的网页（即不能支持动态HTML的网页） 中，你将会注意到文字一直流到屏幕边缘之外，而Tim的图 片朝左浮动。 Tim, the hero. Webmonkey editor and resident banjo-picker. 实际上是它浮动到了本文所在的表格单元的左边。这是一个 重要的区别。当你将HTML放在一个已经被定位了的之

15、内时，你可以把它看作是放在了一个表格单元中（或者象在 其他出版系统之内的制作方法那样）。 在支持HTML 3.2以后的版本的网页中，你可以看到文字自动 回行： Tim, the hero. Webmonkey editor and resident banjo-picker. 现在这个标签里已经填充了内容，让我们利用CSS-P 的LEFT和TOP选项技将其定位。 dramatis personae 显示结果: Tim, the hero. Webmonkey editor and resident banjo-picker. 你可能会注意到在本例中我使用了相对定位。在相对定位和绝对定位中有一个

16、很微妙但确确实实的区别。 当你将一个对象用绝对定位指令定位时，你实际将其从你的HTML文件流中抽了出来，将其直接根据网页的左上角的位置进行定位。这种情况下各个对象有可能互相重叠在一起。 相对定位并不指根据百分比值或其他某个元素的位置来定位这个元素的位置。它实际占据的就是它在这个HTML文件中的位置，它的定位起点基于HTML页所在的位置，这里是一个例子： Tim, the hero. Webmonkey editor and resident banjo-picker.Tim, the hero. Webmonkey editor and resident banjo-picker. 这两个句子

17、中，单词Webmonkey都定位在距左边200像素的位置。第1个句子用的是绝对定位，第2个用的是相对定位。注意相对定位的句子中空出了相当于单词Webmonkey长度的空间，而绝对定位了的句子中没有这个空间，如果我给两个句子都加一个top参数值，则你会看到绝对定位了的句子将飘在文章的顶部，而相对定位的句子则就在它所在的句子的位置之下： Tim, the hero. Webmonkey editor and resident banjo-picker. 现在我们已经了解了两种定位的不同。我们作一个小练习。我们用CSS-P作一个网页。试着做网页，然后我们将制作更复杂的布局（提示：你可以用这个屏幕快照

18、中的图象作为网页背景图象来帮助你定位。注意将字体采用Comic Sans MS）。 你可以注意到上面的那个布局用表格就能很轻易地做到。但是串接样式表比表格有一项独特的优势：分层。 你肯定注意到你无法用表格将几幅图片或文字叠放在一起。一般情况下，如果人们希望实现这种效果只有制作一幅位图，在图片中制作出文字或图象叠放在一起的效果，然后将图片放在网页中。 而利用动态HTML，则可以利用分层顺序将叠放显示各个对象，例：Here is Aaron in front of a desk. Here is Aaron behind a desk. 在这个例子中，Aaron在他的桌子后面，Aaron的图片首先

19、出现在源代码中： 但是如果我们想让Aaron站在桌子前面，我们可以这样写HTML代码： 这种类型的分层在HTML暗示编写。所以搭建动态HTML网页的方法之一就是将各个对象按照显示的前后层次顺序排列排在显示底层的对象最先列出，而排在显示最上层的对象在源代码顺序的最后列出。但是这种方式不一定不出问题。很多时候象在源代码中的顺序和它最后的显示顺序必须没有任何关系。而此时就需要用到z-index CSS属性。 这里是重新制作后的例子。这次的HTML标识和一起一样，但是对象采用了明示的z-index。 Aaron has a z-index of 2. The desk has a z-index of 1. Aaron and the desk have an implied z-index. 两个例子的HTML都是相同的，但CSS不同。 #aaron position:absolute; left: 8px; top: 31px; width: 79px; height: 73px; z-index: 2 z-index可以是一个正值或一个负值（带负值的元素将位于母体元素的下面） ，它所造成的显示效果为：