|
 | 作者: chinawpp [chinawpp]
 论坛用户 |
登录 |
| 第一课 基础 当我们畅游Internet时，我们透过浏览器所看到的网站，是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) 是一种建立网页文件的语言，透过标记式的指令 (Tag)，将影像、声音、图片、文字等连结显示出来。 HTML标记是由 < 和 > 所括住的指令，主要分为 : 单标记指令、双标记指令 ( 由 < 起始标记 >，< / 结束标记 >所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑，完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示，若测试没有问题则可以放到服务器 (Server) 上，对外发布信息。 HTML文件基本架构 <HTML> 文件开始 <HEAD> 标头区开始 <TITLE>...</TITLE> 标题区 </HEAD> 标头区结束 <BODY> 本文区开始 本文区内容 </BODY> 本文区结束 </HTML> 文件结束 <HTML> 网页文件格式。 <HEAD> 标头区 : 记录文件基本资料，如作者、编写时间。 <TITLE> 标题区 : 文件标题须使用在标头区内，可以在浏览器最上面看到标题。 <BODY> 本文区 : 文件资料，即在浏览器上看到的网站内容。 注意事项 通常一份HTML网页文件包含二个部份 : <HEAD>...</HEAD> 标头区、 <BODY>...</BODY> 本文区。而 <HTML> 和 </HTML> 代表网页文件格式。 习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站，浏览器便会自动的找出 index.htm 文件。 第二课 字体 我们在这里将要谈的是有关文字的标记，包括字体大小、颜色、字型...等变化，适当的应用可以增加页面的美观！ 常用字体标记 <Hn>...</Hn> 标题，设定标题字体大小， n = 1 ( 大 ) ~ 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。 如 : <H2> 标题 </H2> 标题 如 : <H3 ALIGN = CENTER> 标题 </H3> ( 标题置中 ) 标题 <B>...</B> 粗体字。 如 : <B> 粗体字 </B> 粗体字 <I>...</I> 斜体字。 如 : <I> 斜体字 </I> 斜体字 <U>...</U> 加底线。 如 : <U> 加底线 </U> 加底线 <DEL>...</DEL> 横线 ( 表示删除 )。 如 : <DEL> 横线 </DEL> 横线 <TT>...</TT> 打字体 ( 固定宽度文字 )。 如 : <TT> 打字体 </TT> 打字体 <SUP>...</SUP> 上标字。 如 : 字体 <SUP> 上标字 </SUP> 字体上标字 <SUB>...</SUB> 下标字。 如 : 字体 <SUB> 下标字 </SUB> 字体下标字 <!...> 注解 ( 不会显示在浏览器上 )，可以多行。 如 : <! 更新日期 : 2000/1/1> 设定字体大小、颜色、字型 有关设定文字的方法共有以下几种 : 1.设定HTML文件主体文字颜色。<BODY>...</BODY>标记。 如 : <BODY TEXT=RED>...</BODY> 或 <BODY TEXT=#FF0000>...</BODY> 2.设定基本字体大小、颜色、字型。<BASEFONT>...</BASEFONT>标记。 3.设定字体大小、颜色、字型。<FONT>...</FONT>标记。 <BASEFONT>...</BASEFONT> 设定基本字体，SIZE = 1 ~ 7，1 ( 最小 ) 7 ( 最大 )。 如 : <BASEFONT SIZE=4> 基本字体大小为 4 </BASEFONT> 基本字体大小为 4 如 : <BASEFONT COLOR =#FF0000> 设定颜色 </BASEFONT> 设定颜色 如 : <BASEFONT FACE = 标楷体 , 细明体 > 设定字型 </BASEFONT> 设定字型 <BIG>...</BIG> 基本字体加大。 如 : <BASEFONT SIZE=4> 基本字体大小为 4，</BASEFONT> <BIG> 加大为 5 </BIG> 基本字体大小为 4，加大为 5 <SMALL>...</SMALL> 基本字体减小。 如 : <BASEFONT SIZE=4> 基本字体大小为 4，</BASEFONT> <SMALL> 减小为 3 </SMALL> 基本字体大小为 4，减小为 3 <FONT>...</FONT> 设定字体大小、颜色、字型，SIZE = 1 ~ 7，1 ( 最小 ) 7 ( 最大 )。 如 : <FONT SIZE=4> 字体大小为 4 </FONT> 字体大小为 4 如 : <BASEFONT SIZE=4> 基本字体大小为 4 <FONT SIZE=+1> +1字体大小为 5 </FONT> <FONT SIZE=-2> -2字体大小为 2 </FONT>...</BASEFONT> 基本字体大小为 4 +1字体大小为 5 -2字体大小为 2 如 : <FONT COLOR =#FF0000> 设定颜色 </FONT> 设定颜色 如 : <FONT FACE = 标楷体 , 细明体 > 设定字型 </FONT> 设定字型 注意事项 1. 设定字体的大小分 : 绝对SIZE 如 : <FONT SIZE=4> 和 相对SIZE 如 : <FONT SIZE=+1> ( 以 BASEFONT 设定的字体大小做加减 )。 2. 设定字体的颜色可以是颜色名称或#RRGGBB表红绿蓝强度 ( 00 暗 ~ FF 亮 )。 #RRGGBB 所代表的是红、绿、蓝三原色，每一色由两位十六进制的数值表示 ( 即十进制 0 ~ 255 )。 十六进制 : 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F。 3. 设定字体的字型会按照顺序找出显示的字型，若找不到则以系统预设字型显示。 第三课 表格 表格是HTML的一项非常重要功能，利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果，使页面更加整齐美观。 常用表格标记 <TABLE>...</TABLE> 表格指令。 相关属性 : ・ALIGN 调整 ・BGCOLOR 背景颜色 ・BORDER 边框 ・HEIGHT 高度 ・WIDTH 宽度 <CAPTION>...</CAPTION> 表格标题。 相关属性 : ・ALIGN 调整 <TR>...</TR> 表格列 ( </TR>可省略 ) 。 相关属性 : ・ALIGN 调整 <TH>...</TH> 表格栏标题 ( 表头 ) 粗体字 ( </TH>可省略 ) 。 相关属性 : ・ALIGN 调整 ・COLSPAN 栏宽 ・ROWSPAN 栏高 <TD>...</TD> 表格栏资料 ( 储存格 ) ( </TD>可省略 ) 。 相关属性 : ・ALIGN 调整 ・BGCOLOR 背景颜色 ・HEIGHT 高度 ・WIDTH 宽度 ・COLSPAN 栏宽 ・ROWSPAN 栏高 举例 如 : ( 基础型 ) <TABLE BORDER=1 ALIGN=CENTER> <TR><TD>太平洋网络学院<TD>太平洋网络学院 <TR><TD>太平洋网络学院<TD>太平洋网络学院 </TABLE> 太平洋网络学院 太平洋网络学院 太平洋网络学院 太平洋网络学院 如 : ( 加强型 ) 增加背景颜色、表格标题、栏标题、跨栏宽、跨栏高。 <TABLE BORDER=1 ALIGN=CENTER BGCOLOR=#CCCCFF> <CAPTION>表格标题</CAPTION> <TR><TD><TH COLSPAN=2>行标题 1 <TH COLSPAN=2>行标题 2 <TR><TH ROWSPAN=2>列标题 1 <TD>A <TD>A <TD>A <TD>A <TR><TD>B <TD>B <TD>B <TD>B <TR><TH ROWSPAN=2>列标题 2 <TD>C <TD>C <TD>C <TD>C <TR><TD>D <TD>D <TD>D <TD>D </TABLE> 表格标题 行标题 1 行标题 2 列标题 1 A A A A B B B B 列标题 2 C C C C D D D D 看了以上的例子，应该了解表格的基本写法吧！ 第四课 标示 HTML提供许多种类的标示标记，作项目标示，而且可以作巢状式标示！ 常用标示标记 <LI> 标示项目。 如 : <OL> <LI>第一项 <LI>第二项 </OL> 第一项 第二项 <OL>...</OL> 编号标示，可标示数字或英文、罗马字母。 如 : <OL TYPE=I> <LI>第一项 <LI>第二项 </OL> 第一项 第二项 <UL>...</UL> 符号标示，可标示数字或英文、罗马字母。 如 : <UL> <LI>第一项 <LI>第二项 </UL> 第一项 第二项 <DT> 定义项目。 <DD> 定义资料。 <DL>...</DL> 定义标示。 如 : <DL> <DT>十进制 :<DD>0、1、2、3、4、5、6、7、8、9 <DT>十六进制 :<DD>0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F </DL> 十进制 : 0、1、2、3、4、5、6、7、8、9 十六进制 : 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F 巢状式标示 如 : <OL> <LI>第一章 <OL TYPE=i> <LI>第一节 <UL> <LI>第一段 <LI>第二段 </UL> <LI>第二节 </OL> <LI>第二章 <LI>第三章 </OL> 第一章 第一节 第一段 第二段 第二节 第二章 第三章 其他标示标记 <DIR>...</DIR> 目录式标示 ( 自动加圆点 )。 如 : 网络学院 : <DIR> <LI>新手上路 <LI>软件教室 <LI>设计教室 <LI>开发教室 </DIR> 网络学院 : 新手上路 软件教室 设计教室 开发教室 注意事项 标示项目符号也可以用<FONT>...</FONT> 标记，以符号字元 ( ○、◆、◎、★、■...等 ) 标示。 如 :<FONT COLOR =#FF0000> ● </FONT> 特殊符号 : 在HTML文件中，有些符号是代表特定的意义的。所以当我们要使用这些特殊符号时，便要用替代指令。 符号 替代指令 " " 或 " & & 或 & < < 或 < > > 或 > 不可分空格   第五课 区段标记 一个网站不仅要内容丰富外，也要有美观简洁的版面。HTML所提供的区段标记功能，如果可以好好的利用也会有相当不错的效果。 常用区段标记 <HR> 产生水平线。 如 : <HR ALING=CERTEN WIDTH=90%> -------------------------------------------------------------------------------- <BR> 跳下一行。 如 : 太平洋网络学院，<BR>网上学电脑的好去处。 太平洋网络学院， 网上学电脑的好去处。 <P>...</P> 段落，跳下一行并加一行空白。 ( </P> 可省略 ) 如 : 太平洋网络学院，<P>网上学电脑的好去处。 太平洋网络学院， 网上学电脑的好去处。 <CENTER>...</CENTER> 置中。 如 : <CENTER>置中</CENTER> 置中 <NOBR>...</NOBR> 不跳下一行。 如 : <NOBR>太平洋网络学院，</NOBR>网上学电脑的好去处。 太平洋网络学院，网上学电脑的好去处。 <PRE>...</PRE> 以文件原始格式显示。 如 : <PRE>原始格式: 文件</PRE> 原始格式: 文件 第六课 链接 链接可说是HTML中最重要的功能！因为HTML拥有链接的功能，使你能接上INTERNET、WWW ……享受多姿多彩的网络世界。 基本上链接分成 : 外部链接--链接至网络的某个URL网址或文件，可参考考网络链接方式。 内部链接--链接HTML文件的某个区段。 网络链接方式 网络链接方式 : //主机名称 / 路径 / 文件名称 网址 如 : http : //www.pconline.com.cn/ 文件传输 如 : ftp : //ftp.pconline.com.cn/ GROPHER 传输 如 : gropher : //gropher.net.cn/ 远端登入 如 : telnet : //bbs.net.cn/ 文件下载 如 : file : //data/html/file.zip NET NEWS 传输 如 : news : talk.hinet.net.cn E-Mail 如 : mailto : pcedu@pconline.com.cn 常用链接标记 <BASE> 设定基本URL位置或路径，以後只要设定文件名称即会自动加上位置或路径。 相关属性 : ・HREF 链接的URL位址或文件 ・TARGET 指定链接到的URL位址或文件显示于那一个视窗 ( 可和 <FRAME> 视窗标记配合使用或开新的视窗 ) 如 : <BASE HREF="http : //www.pconline.com.cn/"> <A HREF="kk.htm">■</A> <BASE HREF="http : //www.pconline.com.cn/" TARGET=frame1> <A>...</A> 链接指令。 相关属性 : ・HREF 链接的URL位址或文件 ・NAME 名称 ・TARGET 指定链接到的URL位址或文件显示于那一个视窗 ( 可和 <FRAME> 视窗标记配合使用或开新的视窗 ) 如 : 外部链接 <A HREF="http : //www.pconline.com.cn/">■</A> <A HREF="http : //www.pconline.com.cn/" TARGET=frame1>■</A> 内部链接 ・CH1.HTM 文件 <A HREF=#A>■</A> ( 欲链接至HTML文件 A 点 ) <A NAME=A>■</A> ( HTML文件 A 点 ) ・CH2.HTM文件 <A HREF=CH1.HTM#A>■</A> (欲链接至CH1.HTM 文件 A 点 ) " ■ " 表示链接点，可以是文字或图案。( 即游标移到时，会变成手指形状的地方 ) <LINK> 链接指令 ( 用于HEAD区，设定CSS文件 )。 <META> 储存应用资讯，可设定时间载入网页 ( 用于HEAD区 )。 相关属性 : ・CHARSET 设定 ・CONTENT 回应表头资料内容 , 若是数字表示秒数 ・HTTP-EQUIV 回应表头 , 若设定为REFRESH载入URL设定 ・URL HTML位置 如 : ・设定中文自动跳行。 <META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=gb2312"> ・设定十秒回到首页。 ( 若不设定HTML文件位置则再载入原HTML文件 ) <META HTTP-EQUIV="REFRESH" CONTENT=10 URL=index.htm> 设定链接、未链接部份颜色 设定链接、未链接部份颜色，用<BODY>...</BODY>标记。 相关属性 : ・ALINK按下链接部份未放开时颜色 ・LINK未看过的链接部份颜色 ・VLINK已看过的链接部份颜色 如 : <BODY LINK=#0000FF ALINK=#FF0000 VLINK=#00FF00> 第七课 框架 框架架构的标记，主要是分割窗口和插入浮动窗口的功能。如果能有效的运用将有助于浏览网页的效率！ 常用窗口标记 <FRAMESET>...</FRAMESET> 定义分割窗口。 相关属性 : ・BORDER 边框 ・COLS 行 , 设定分割左右窗口宽度 ( 用『,』分隔，可设百分比 % ;『*』表示剩余部份 ) ・FRAMEBORDER 显示边框 ・ROWS 列 , 设定分割上下窗口高度 ( 用『,』分隔，可设百分比 % ;『*』表示剩余部份 ) <FRAME> 定义窗口。 相关属性 : ・FRAMEBORDER 显示边框 ・NAME 名称 ・NORESIZE 设定是否可以调整窗口大小 ・SRC 文件或URL位址 ・SCROLLING 设定是否可以卷动 <NOFRAMES>...</NOFRAMES> 无支援分割窗口浏览器显示文字。 <IFRAME>...</IFRAME> 插入浮动窗口。 相关属性 : ・BORDER 边框 ・FRAMEBORDER 显示边框 ・NORESIZE 设定是否可以调整窗口大小 ・SRC 文件或URL位址 ・SCROLLING 设定是否可以卷动 举例 如 : 本站窗口架构。 ( 先分割成上下窗口，再于窗口各分割成左右窗口。 ) <FRAMESET ROWS=74,* COLS=140,* FRAMEBORDER=NO BORDER=0> <FRAME SRC=rad.htm NAME=RAD NORESIZE SCROLLING=NO> <FRAME SRC=a-1.htm NAME=FRAME1 NORESIZE SCROLLING=NO> <FRAME SRC=b-1.htm NAME=FRAME2 NORESIZE SCROLLING=AUTO> <FRAME SRC=c-1.htm NAME=FRAME3 NORESIZE SCROLLING=AUTO> </FRAMESET> 如 : 浮动窗口 <CENTER> <IFRAME FRAMEBORDER=YES SCROLLING=YES SRC=c1-01.htm> </IFRAME> </CENTER> 注意 窗口基本架构的文件，通常放在HTML文件的第一页，如 : index.htm 。此HTML文件的基本架构并不需要本文区 ( BODY )，只需定义窗口架构，而其他HTML文件可用连结方式 ( A HREF=...连结标记 TARGET属性 ) 显示于指定的窗口中。 第八课 设置图片 现在的网站没有用图片的，几乎很少了吧！图片增加了网站版面的美观，不过也不要放了大量的图片，而拖慢网站传输的效率喔！ 有关设定图片的方法共有以下几种 : 设定HTML文件背景图片、背景颜色。<BODY>...</BODY>标记。 如 : <BODY BACKGROUND=A.GIF>...</BODY> 或 <BODY BGCOLOR=#000000>...</BODY> 设定图片。<IMG>标记。 设定地图。<MAP>...</MAP>标记。 常用图片标记 <IMG> 指令 相关属性 : ・ALIGN 调整 ・ALT 提示字 ・BORDER 边框 ・HEIGHT 高度 ・SRC 文件或URL位址 ・USEMAP 地图名称 ・WIDTH 宽度 如 : 可插入图片 ( GIF、JPG格式 )、AVI电影 <CENTER> <IMG SRC="../../../images/pcedu_lo.gif" ALT="太平洋网络学院" ALIGN=TOP BORDER=1> </CENTER> <MAP>...</MAP> 地图 相关属性 : ・NAME 名称 <AREA> 设定地图动作区域 相关属性 : ・COORDS 设定动作区域座标 ( 左上角座标 : X1,Y1 ; 右下角座标 : X2,Y2 ) ・HREF 动作区域连结点 ( 可载入位址或文件 ) ・NOHREF 动作区域连结点不动作 ・SHAPE 外型 举例 设定地图 <IMG BORDER=0 SRC=A.GIF USEMAP=#A> <MAP NAME=A> <AREA SHAPE=RECT COORDS=0,0,200,100 HREF=1.HTM> <AREA SHAPE=RECT COORDS=0,100,200,200 NOHREF> <AREA SHAPE=RECT COORDS=0,200,200,300 HREF=3.HTM> </MAP> 第九课 加入声音 HTML不仅能插入图片，也可以载入MIDI音乐、WAV 音效喔！ 常用音乐标记 <BGSOUND> 背景音乐、音效。 相关属性 : ・LOOP 循环 , 背景音乐播放次数 ・SRC 文件或URL位址 (可为WAV、MIDI格式 ) 如 : <BGSOUND SRC=m-1.mid LOOP=True> 内嵌音乐插件 <EMBED>...</EMBED> 内嵌插件。 相关属性 : ・HEIGHT 高度 ・WIDTH 宽度 ( 可设百分比% ) ・SRC 设定内嵌物件的 URL 位址 ・LOOP 循环 , 背景音乐播放次数 ・AUTOSTART 自动播放 如 : <EMBED SRC=m-1.mid WIDTH=145 HEIGHT=60 AUTOSTART=True LOOP=True></EMBED> 第十课 滚动条 这是由IE提供的滚动条，可不要被众多的属性吓到了，越多的属性功能越强喔！ 【文字卷动标记】 <MARQUEE>...</MARQUEE> 文字卷动 ( 滚动条 )。 【相关属性】 ・BEHAVIOR = 设定卷动方式 -- ALTERNATE 交替来回卷动 -- SCROLL 卷动 ( 预设 ) -- SLIDE 滑动 ・BGCOLOR = color 背景颜色 ・DIRECTION = 设定卷动方向 ・HEIGHT = n 高度 ・LOOP = n 循环 , 卷动次数 ( 预设循环 ) ・SCROLLAMOUNT = n 设定卷动距离 ・SCROLLDELAY = milliseconds 设定卷动时间 ・TRUESPEED = milliseconds 设定卷动速度 ・WIDTH = n 宽度 ( 可设百分比% ) 【举例】 如 : <MARQUEE BGCOLOR=RED BEHAVIOR=ALTERNATE DIRECTION=LEFT SCROLLAMOUT=10 SCROLLDELAY=100> <FONT COLOR=WHITE>太平洋网络学院</FONT></MARQUEE> 太平洋网络学院 如 : <MARQUEE BGCOLOR=GREEN HEIGHT=50 BEHAVIOR=SCROLL DIRECTION=UP SCROLLAMOUT=10 SCROLLDELAY=300> <FONT COLOR=WHITE><CENTER>太平洋网络学院</CENTER></FONT></MARQUEE |
| 地主 发表时间: 05/21 09:55 |
 | 回复: abomb [abomb]  论坛用户 |
登录 |
|
我还没学到C++ 只学完C 拉不知道那个C#会不会很不好学啊 还有JAWA语言 |
| B1层 发表时间: 05/21 10:34 |
|
20CN网络安全小组版权所有
Copyright © 2000-2010 20CN Security Group. All Rights Reserved.
论坛程序编写：NetDemon
粤ICP备05087286号
论坛: 编程破解
标题: html>>>>>vc++:)