1、网页架构
<HTML>
<HEAD>
<TITLE>网页制作教学</TITLE>
<Meta>
</HEAD>
<BODY>
BODY之间则为主要语法所在,也是网页的主要呈现部分。
</BODY>
</HTML>
2、分隔标签
1)换行 <br>
2) 段落 <p> </p>
3) 分割线标签 <hr color="颜色" width="宽度" sise="厚度" align="水平对齐位置" >
利用分割标签可以产生一条横分割线。
3、排版标签
1)<center>这是置中</center>
除了文字,对于图片、表格, 任何可以在显示在网页中的东西都可以置中。
2)向右缩排标签 <blockquote>要缩排的文字</blockquote>
将包围的文字,全部往右缩排。加一组标签,缩排一单位,加两组标签,缩排两单位
3)保存原始格式标签 <pre> 文字内容 </pre>
将包围起来的文字排版、格式,原封不动的呈现出来。
4、标题标签
1)标题标签
<h1>标题一</h1>
;
;
<h6>标题六</h6>
2)字体大小标签
<font size=1>字体一</font>
:
:
<font size=1>字体七</font>
3)字型变化标签
(1)粗体 <b>粗体</b>
(2)斜体 <i>斜体</i>
(3)底线 <u>底线</u>
(4)上标 <sup>上标</sup>
(5)下标 <sub>下标</sub>
(6)打字机 <tt>打字机</tt>
(7)闪烁 <blink>闪烁</blink>(ie没效果)
(8)强调 <em>强调</em>
(9)加强 <strong>加强</strong>
(10)范例 <samp>范例</samp>
(11)原始码 <code>原始码</code>
(12)变数 <var>变数</var>
(13)定义 <dfn>定义</dfn>
(14)引用 <cite>引用</cite>
(15)所在地址 <address>所在地址</address>
4) 文字颜色
<font color="文字颜色">文字</font>
5) 文字字型设定
<font face="字型名称">文字</font>
eg:<font face="楷体_GB2312">楷体_GB2312</font>
6)对齐方式
align="对齐方式"
right 右对齐
left 左对齐
top 上对齐
bottom 下对齐
middle 中间
absmiddle 绝对中间
7)常用符号
(1)不可拆分的空格  
(2)小于 < <
(3)大于 > >;
(4)and & &
(5)英镑 ₤ £
(6)欧元 € €
(7)注册 ® ®
(8)版权 © ©
(9)引号 " "
(10) 人民币 ¥ ¥
5、影像标签
<img src="boy.gif" alt="说明文字" align="对齐方式"
border="边框大小" height= "高度" width="宽度" >
6、背景标签
<body bgcolor="背景色" background="背景图片">
7、内文、连接文字颜色
<body text="颜色码" link="颜色码" vlink="颜色码" alink="颜色码">
text="颜色码" 若没有特别去设定文字颜色的话,浏览器会自动显现您所设定的颜色
link="颜色码" 没按下链接之前,只要有链接的地方就会出现制定的颜色码
alink="颜色码" 按下链接是瞬间所呈现的颜色
vlink="颜色码" 已经被按过的链接所呈现的颜色
8、超链接
<a href="" target="参数">
框窗名称 只有在框架或frame中采用。
利用此标签,来指定连接的内容显示到哪一个框窗中。
_blank 将连结的画面内容,开在新的浏览视窗中。
_parent 将连结的画面内容,当成文件的上一个画面。
_self 将连结的画面内容,显示在目前的视窗中。
_top 会将整个画面重新显示成连结的画面内容。
9、表格
<table width="宽度" height="高度" border="线条粗细"
BORDERCOLORLIGHT="亮面颜色设定F" BORDERCOLORDARK="暗面颜色设定"
CELLPADDING="表格内文距离格线的距离" CELLSPACING="表格栏位格线之间的距离" >
<tr bgcolor="背景色">
<td align="对齐方式">
</td>
</tr>
</table>
10、序列标签
1)无序列表
(1)
<UL>
<LI>姓名:杰克升
<LI>生日:1974/11/21
<LI>星座:天蝎座
</UL>
(2)
<UL TYPE="CIRCLE">
<LI>姓名:杰克升
<LI>生日:1974/11/21
<LI>星座:天蝎座
</UL>
TYPE="形状名称"属性来改变其符号形状,一共有三个选择:
DISK(实心圆)、SQUARE(小正方形)、CIRCLE(空心圆)
2)有序列表
(1)
<OL>
<LI>姓名:杰克升
<LI>生日:1974/11/21
<LI>星座:天蝎座
</OL>
从1开始
(2)
<OL TYPE="A" START="H">
<LI>姓名:杰克升
<LI>生日:1974/11/21
<LI>星座:天蝎座
</OL>
从H开始
11、表单的标签
1)单行文字输入
<FORM>
姓名:<INPUT TYPE="TEXT" NAME="NAME" SIZE="20">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一栏位的名称,程式中常会用到。
SIZE="数值",是设定此一栏位显现的宽度。
VALUE="预设内容",是设定此一栏位的预设内容。
ALIGN="对齐方式",是设定此一栏位的对齐方式,
TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)
RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)
BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置中)、ABSBOTTOM(绝对置下)
MAXLENGTH="数值",是设定此一栏位可设定输入的最大长度。
2)单选核取表单
<FORM>
性别:
<INPUT TYPE="RADIO" NAME="SEX" VALUE="BOY">男
<INPUT TYPE="RADIO" NAME="SEX" VALUE="GIRL">女
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一栏位的名称,程式中常会用到。
VALUE="内容",是设定此一栏位的内容、值或是意义。
ALIGN="对齐方式",是设定此一栏位的对齐方式
CHECKED,是设定此一栏位为预设选取值。
3)复选核取表单
<FORM>
喜好:
<INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="MOVIE">电影
<INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="BOOK">看书
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一栏位的名称,程式中常会用到。
VALUE="内容",是设定此一栏位的内容、值或是意义。
ALIGN="对齐方式",是设定此一栏位的对齐方式
CHECKED,是设定此一栏位为预设选取值。
4)密码表单
<FORM>
请输入密码:<INPUT TYPE="PASSWORD" NAME="INPUT">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一栏位的名称,程式中常会用到。
SIZE="数值",是设定此一栏位显现的宽度。
VALUE="预设内容",是设定此一栏位的预设内容,不过呈现出来仍是星号。
ALIGN="对齐方式",是设定此一栏位的对齐方式
MAXLENGTH="数值",是设定此一栏位可设定输入的最大长度。
5)按钮
<FORM>
<INPUT TYPE="SUBMIT" VALUE="送出资料">
<INPUT TYPE="RESET" VALUE="重新填写">
<INPUT TYPE="BUTTON" NAME="OK" VALUE="我同意">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一按钮的名称。
VALUE="文字",是设定此一按钮上要呈现的文字。
ALIGN="对齐方式",是设定此一栏位的对齐方式
6)多行文字输入
<FORM>
请输入您的意见:<BR>
<TEXTAREA NAME="TALK" COLS="20" ROWS="3"></TEXTAREA>
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一栏位的名称。
WRAP="设定值",是设定此一栏位的换行模式。设定值有三种:
OFF(输入文字不会自动换行)
VIRTUAL(输入文字在萤幕上会自动换行,不过若是使用者没有自行按下ENTER换行,
送出资料时,也视为没有换行)
PHYSICAL(输入文字会自动换行,送出资料时,会将萤幕上的自动换行,视为换行效
果送出)。
COLS="数值",是设定此一栏位的行数(横向字数)。
ROWS="数值",是设定此一栏位的列数(垂直字数)。
7)下拉列表框
<FORM>
您喜欢看书吗?:
<SELECT NAME="LIKE">
<OPTION VALUE="非常喜欢">非常喜欢
<OPTION VALUE="还算喜欢">还算喜欢
<OPTION VALUE="不太喜欢">不太喜欢
<OPTION VALUE="非常讨厌">非常讨厌
</SELECT>
</FORM>
其有下列可设定之属性:
SIZE="数值",是设定此一栏位的大小,预设值为1,若是您的选项有四个,然后您将
SIZE设成4,那么,下拉式选单便会变成选项方块,将四个选项一起呈现在方块中。
MULTIPLE,是设定此一栏位为复选,可以一次选好几个选项。
12、框架标签
<HTML>
<HEAD>
<TITLE>框窗实作</TITLE>
</HEAD>
<FRAMESET COLS="120,*">
<FRAME SRC="a.htm" NAME="1">
<FRAMESET ROWS="100,*">
<FRAME SRC="b.htm" NAME="2">
<FRAME SRC="c.htm" NAME="3">
</FRAMESET>
</FRAMESET>
</HTML>
其它参数说明:
<FRAMESET COLS="120,*" frameborder=0 framespacing=5>
1) COLS="120,*"
就是垂直切割画面啦!你可以一次切成左右两个画面,当然也可以切成三个,很
简单只要写成 COLS="30,*,50" (数字随便您自己调整啦!),依此类推,四个
以上当然就是四组数字啦!
2) ROWS="120,*"
就是横向切割画面,也就是将画面上下分开,切法同上。
3) frameborder=0
设定框架的边框,其值只有 0 和 1 , 0 就是不要边框, 1 就是要显示边框。
边框是无法调整粗细的。
4) framespacing=5
表示框架与框架间的保留空白的距离,以免看起来太挤。
<FRAME SRC="a.htm" NAME="1" frameborder=0 scrolling="no" noresize
marginhight=2 marginwidth=2>
1) SRC="a.htm"
设定此框架中要显示的网页名称,每个框架一定要对应一个网页,否则就会产生
错误,这里就是要您填入对应网页的名称。(如果该网页在不同目录,记得路
径要写清楚)
2) NAME="1"
设定这个框架的名称,这样才能指定框架来作连结,所以一定要设定喔!当然名
称随你高兴取名。
3) scrolling="no"
设定是否要显示卷轴,YES是要显示卷轴,NO是无论如何都不要显示,AUTO是视情
况显示。
4) noresize
设定不让使用者可以改变这个框框的大小,如果没有设定这个参数,使用者可以
很容易的拉动框架,改变其大小。
5) marginhight=2
表示框架高度部份边缘所保留的空间。
6) marginwidth=2
表示框架宽度部份边缘所保留的空间。
target=框窗名称
eg:<A HREF="d1-1.htm" target=3>显示内容</A>
13、背景音乐
<bgsound src="music.mid">
可是用NetScape看就没有声音了最好用embed标签 <embed src="music.mid">
14、Meta Tag 的简介
1)<Title>All Products Online</title>
这虽说不是meta的一部份,但是也不可忽略,总长度不要超过85个Character (约10
个字)。
2)<meta http-quive="content-type" content="text/html; charset=iso-8859-1">
说明网站的格式及编码方式,另外这个功能也可以拿来说明网站的名称。
3)<meta name="keyword" contents="关键字一, 关键字二, 关键字三, …..">
铲明整个网站的关键字,关键字间用逗点隔开,总长度最好不要超过1000个
Character (约44个字)。
4)<meta name="description" contents="整个网站的描述….">
铲明整个网站为何吸引人的地方,可用逗点隔开,总长度最好不要超过200个
Character (约15个字),若文章真的太长,可以切割成两个部分,较不重要的部分
置入下一个Description。
5)<meta name="robots" content=" ALL, NONE, INDEX, NOINDEX, FOLLOW, NOFOLLOW">
此功能是要给搜寻引擎使用的,是要用来告诉Spider哪些网页是要去撷取的或不用
去撷取的,一般都设定成All(内定值)。
分享到:
相关推荐
总的来说,这本《ASP网络开发详解完全手册》是学习ASP网络编程的宝贵资源,无论你是初学者还是有经验的开发者,都能从中找到丰富的知识和实用技巧,提升你在ASP领域的技能水平。通过阅读本书,你将能够构建出功能...
总之,《网页开发手记:HTML+CSS+JavaScript实战详解》是一本全面而实用的教程,无论你是完全的初学者还是有一定基础的学习者,都能从中受益。通过这本书的学习,你将能够独立创建功能齐全、美观的静态网页,并为...
本手册“完全手册:JavaScript动态网页开发详解.教程.光盘”深入探讨了JavaScript的核心概念和技术,旨在帮助开发者全面掌握这一重要技能。 JavaScript的基础包括变量、数据类型、运算符、控制结构(如条件语句和...
**JSP语法详解** 在Web开发领域,JavaServer Pages(JSP)是一种强大的技术,它允许开发者使用HTML、XML或其他标记语言来创建动态网页。JSP语法是学习JSP的基础,它结合了静态内容和动态生成的内容,为开发人员提供...
- **搭建学习环境**:在本地计算机上设置一个简单的HTML文件,引入ExtJS的库文件,确保浏览器支持JavaScript,并且禁用或配置好任何可能阻止脚本运行的安全设置。 - **测试例子**:开始时,可以尝试运行官方提供的...
"PHP网络开发详解源码"这个主题涵盖了从基础到高级的PHP编程技术,结合了孙鹏程的完全手册,为开发者提供了一套全面的学习资源。源码的提供更是让学习者有机会直接操作和理解代码执行的过程,加深对PHP的理解。 ...
本书旨在为初学者提供一个系统学习HTML5的平台,通过从基础语法到高级特性的全面讲解,帮助读者掌握HTML5的各项技能。无论是完全没有编程经验的新手还是有一定基础的前端开发者,都能从本书中获益匪浅。 #### HTML5...
在本完全手册中,我们将深入探讨JavaScript在动态网页开发中的应用与技巧,旨在为开发者提供一个全面、实用的指南。JavaScript作为Web开发的核心语言之一,其功能强大且灵活性高,被广泛应用于创建交互式网站。以下...
"网页制作完全手册"是一个全面的学习资源,它涵盖了HTML标签大全和CSS详解,旨在帮助初学者和进阶者提升网页设计能力。下面我们将深入探讨这两个核心知识点。 HTML(HyperText Markup Language)是网页内容的基础,...
JavaScript语言的基本语法要求是学习和掌握JavaScript的关键,以下是详细介绍: 一、区分大小写 JavaScript语言严格区分字符大小写。这意味着在JavaScript中,变量、函数名、关键字等都是区分大小写的。例如,...
- HTML5简介:这部分可能会介绍HTML5的基本语法、结构以及新的标签和属性,让读者对HTML5有一个总体的认识。 2. HTML5的多媒体支持 - HTML5视频(Video):介绍了在HTML5中如何嵌入视频内容,支持的格式和相关的...
Ruby是完全的面向对象语言,所有数据都被视为对象,包括基本类型。它的Hello World程序很简单,仅需一行代码即可输出"Hello, world!"。Ruby的变量没有预设类型,可以根据需要存储任何类型的数据。此外,变量命名规则...
由于给定文件的【部分内容】无法提供有效信息,以上知识点的解释和示例完全是根据标题和描述推断生成的。在实际学习和应用中,开发者应该查阅官方文档和参考书籍,以获取更准确和详尽的信息。同时,访问提供的链接...
### jQuery语法知识点详解 #### 一、引入jQuery 在网页中使用jQuery之前,需要先引入jQuery库。有几种常见的引入方式: 1. **本地引入**: ```html <script type="text/javascript" src="jquery.js"></script...
**jQuery 语法详解** jQuery 是一个广泛应用于 Web 开发中的 JavaScript 库,它极大地简化了对 HTML 文档的处理、事件处理、动画以及Ajax交互。jQuery 的核心特性就是它的选择器和简洁的语法,使得开发者能够高效地...
- HTML和CSS语法详解 - JavaScript基础及DOM操作 - DHTML实例分析和实践项目 - 常见问题与解决策略 通过阅读《DHTML网页制作完全手册》.chm文件,你可以深入理解DHTML技术,掌握创建动态网页的技能。这份手册将引导...
总结,这个PPT资料涵盖了从基础的HTML、CSS到更高级的ASP、JavaScript、SHTML和DHTML的Web开发技术,并通过视频教程的方式进行讲解,适合初学者系统学习和提升。通过掌握这些知识点,开发者能够创建出功能丰富、交互...
- 语法:`rgba(red, green, blue, alpha)`,其中alpha取值范围为0到1,0表示完全透明,1表示完全不透明。 2. **HTML5与JavaScript的基本知识**: - HTML5提供了更丰富的标签和API,使网页制作更为便捷。 - ...
- **知识点概述**:适合完全没有编程基础的学习者,从最基础的概念入手,逐步引导学员进入Python编程的世界。 - **关键内容**: - Python语言特点介绍; - 第一个Python程序; - 基本语法:变量、数据类型、...