- 浏览: 163408 次
- 性别:
- 来自: 杭州
文章分类
最新评论
-
zhousheng193:
非常感谢LZ
在JSP页面及servlet的doGet()方法中处理汉字乱码的问题 -
jie523314:
学习下。。。
读取XML文件
WWW基本概念
www的全称为World Wide Web,即全球广域网(万维网),是一种基于TCP/IP协议的网络信息服务。当WWW服务器接收到请求时,将HTML标记的文本发送给请求者,请求者的浏览器把HTML文本翻译后,显示在窗口中。
HTML简介
下面就一个简单的HTML文件进行解释,使读者对之有一个感性的认识,为以后的学习打下基础。读者可以对照其在浏览器中的显示情况,来了解HTML文件的基本格式、概念和标记。在编辑的文本文件中写出如下内容(可以使用Windows自带的记事本来编写):
通过上面的实例可以发现HTML文件是纯文本文件,是用ASCⅡ码编写的源文件,可以用任何一个文本编辑器(如记事本notepad)打开和编辑。HTML文件包括两部分。
*文件的内容部分
*HTML的标识部分。
大多数HTML标识的书写格式如下:
<标识名>显示内容</标识名>
浏览器的功能是:解释并显示HTML文件。需要注意的是:对于同一个HTML文件,不同的浏览器显示的效果可能不一样。
下面介绍所用的标识:
*<HTML></HTML>标识:任何一个HTML文件都应该以该标识开头和结尾,该标识告诉浏览器使用HTML语言来解释和显示该文件。其他内容都应写在该标识之间。
*<head></head>标识:该标识是网页头部标识。写在该标识之间的内容一般不显示出来,只有后面讲到的<title></ title >标识会显示在浏览器顶部的蓝色标题栏中。
< title ></ title >标识:该标识放置于< head ></ head >标识之间,其中间书写的内容将显示在浏览器的顶部标题栏中,是HTML文件的标题,如上例所示,标题的内容可以任意制定,也可以不写。
*<body></body>标识:网页的主题内容应该放置在该标识之间,而该标识应该放置在<HTML></HTML>标识内部。
<HR>分隔线标识 :别忽视我阿!
<HR>的语法很简单,在需要插入分隔线的位置输入该标识即可,例如现在需要在上一个实例的第一句话后面插入一条分隔线,使之布局全理,可以将其源代码更改如下:
<br>行中断标识
在HTML语言中,实现换行是靠一个行中断标识<br>来实现的。
例如可以将上一个实例的源代码修改如下:
元信息标记<meta>
<HEAD>
开始标签
<TITLE>银河信息技术学院</TITLE>
网页文档标题
<meta http-equiv="Content-type" content="text/html; charset=gb2312">
网页文档字符编码设置
<META content=银河,网盾工程,安全资讯,黑客入门,黑客攻防,软件下 name=keywords>
网页文档关键字的设置
<META content=银河信息技术学院。 name=description>
网页文档描述信息的设置
<LINK href="../images/cixicn.css" type=text/css rel=stylesheet>
网页文档链接样式表文件的设置
</HEAD>
结束标签
<meta>标记的主要作用是向服务器和客户端传达关于文档的隐藏信息。
<meta http-equiv="Content-type" content="Text/html; charset=gb2312">
属性说明:
http-equiv:设置或获取用于将 META 标签的 content 绑定到 HttP 响应头的信息。
Content:设置或获取与 HttP-EQUIV 或 NAME 关联的资源信息。
Charset:设置或获取用于解码对象的字符集。
<META content=银河,信息技术学院,网盾工程 name=keywords>
<META content=银河信息技术学院 name=descripTion>
属性说明:
Name:设置或获取META 对象的 CONTENT 标签属性中指定的值。
name值为“keywords”主要设置网站的关键字。
name值为“description”主要设置网站的描述信息。
例如:
<Bgcolor>
例如:
Background
<text>
例如:
Leftmargin 设定页面左边距,Topmargin 设定页面上边距
例如:
<font>文本修饰标识
先来看一个实例,实例源代码如下:
这是我第一次做主页。
<br>
无论怎么样,我都会努力做好!
</body>
</HTML>
1.字号属性 :twisted:
Size属性有1到7个等级,1级的字号最小,7级最大,默认的字号大小是3号(大约相当于Word里的5号,16个像素),可以使用“size=?”定义字号的大小,例如输入下面的代码:
2.字体属性
Face属性定义的是字体的名称,如中文字体的“宋体”、“楷体”、“隶书”等,可以在写字板和Word等字处理软件中找到不当前系统中安装的字体名称,例如输入以下代码:
3.颜色属性
Color属于可以用浏览器承认的颜色名称和十六进制数值表示(如<font color=red>或<font color=#808080>)。
<h1>到<h6>
例如:
粗体标记<b>\斜体标记<i>\下划线标记 <U>
例如:
上标标记 (<SUP>…</SUP>)\下标标记 (<SUB>…</SUB>)
例如:
2<SUP>2</SUP>
银河信息技术学院<SUB>数码组</SUB>
<a>超链接标识
语法:<a>文档</a>
属性:
1.Href 设置文本链接的地址
2.Target 目标窗口打开方式,值为“_blank”是弹窗打开,值为“_self”为自身窗口重定向。
3.Title 是鼠标悬停在链接文本上的文字提示。
现在可以创建一个最简单的链接:
<a href="http://www.sina.com">新浪网</a>
把协议换成"mailto:",如:<a href="mailto:marsz@163.net">给我来信</a>,这样如果点击该链接,系统就会打开默认的E-mail程序进行处理,另一个和它相似是而的协议是"newsgroup:",它将打开默认的信息组程序,用法和打开E-mail类似。
下面以一个具体实例说明:
<Img>图像标识
目前有以下几种图像格式能被Web浏览器直接解释:GIF格式(.GIF文件,支持256色);X位图格式(.XBM文件,黑白图像);JPEG格式(.JPG、.JPEG文件,支持RGB色)。
对于段落中的图像,[u]还可以利用align属性定义图像与文本行的对齐方式,其属性值可取top(与文本行顶部对齐)、middle(中间对齐)、bottom(底部对齐,默认值)、left(将此图显示在窗口左方)、right(将此图显示在窗口右方)。[/u]
用<img>来表示网页中的一幅图像
<h2><img align=middle src="kdx.gif"> This text lineis middle-align.</h2>
如果让图像单独占一块区域,要在图像标记的前后加上<P>或<BR>标记:
<p><img src="kdx.gif"><p>This image is stand al onewith the text.<p>
例如在网页中插入一个名字为kdx.jpg的图像,宽度为100个像素,高为120个像素,则输入:
<img src="kdx.jpg"width="100"height="120"alt="暴躁猪的猪圈">
还可以在图像上设置超级链接,其标记为<A></A>:
<a href=http://www.lilacsoft.com/>
<img src="kdx.jpg" width="100" height="120" alt="暴躁猪的猪圈" border=2>
</a>
Web浏览器在超链接图的四周显示一个边框,以示可被触发。若想去掉这个边框只需在<img>中加上属性border=0就可以了。
段落标记<P>…</P>与换行标记<br>
水平线标记<hr>
插入一条水平线
属性:Color 颜色的定义 如:color=#ff0000 红色
Size 粗细的定义 如:Size=5
Width 宽度的定义 如:width=500像素 宽度的单位有两个,像素(像素)或%(百分比)
居中标记<center>…</center>
居中标记从文本意义上理解就是居中对齐,凡是放在<center>开始标记和</center>结束标记中的内容,无论是文本还是图片或者是表格等等都可以实现居中显示。
预先格式化标记<pre>…</pre>
无序列表:
无序列表标记符<UL></UL>和列表项标记符<LI></<LI>
有序列表:
有序列表标记符<OL></OL>和列表项标记符<LI></LI>
OL 标记符具有两个常用的属性:type 和 start,分别用来设置数字序列样式和数字序列起始值。start 属性的值可以是任意整数, type 属性的值如下表所示3-5-3.23:
例如:
声音和视频
Web浏览器自身不能解释声音和视频文件,但它能通过其他辅助工具的帮助来播放声音和视频文件。一般声音文件带有.WAV、.AU、SND等文件扩展名,而视频文件带有.AVI、.MPG等文件扩展名。
<h2><a href="沉默的羔羊.avi">这是一段电影</a>.</h2>,用户触发这段超级链拉后,Web浏览器会立即启动默认的网络视频播放工具程序,如Media Player程序来播放“沉默的羔羊”视频文件。
背景音乐的插入方法很多,在这里我们只介绍两种:
第一种:
<bgsound src="file:///F://mp3/爱情转移.wma" loop="1">
<bgsound src="your.mid">
属性设置:
因为bgsound嵌入的音频文件在网页中没有控件显示,所以在使用bgsound时,它的各个属性就必须加以设置。
1.自动播放:
语法:autostart=true、false
说明:该属性规定音乐文件是否在下载完之后就自动播放。
True:音乐文件在下载完之后自动播放;
false:音乐文件在下载完之后不自动播放。
示例:<bgsound src="your.mid" autostart=true>
<bgsound src="your.mid" autostart=false>
2.循环播放:
语法:loop=正整数或infinite
说明:该属性规定音乐文件的循环次数。
第二种:
<embed src=音乐链接地址 width=200 height=50 type=audio/mpeg loop="true" autostart="true">
代码说明:
支持的音乐格式: wma、mp3、rm、ra、ram、asf,尽量选用可连接性高的音乐链接,保证音乐可以顺利播放;
width和height表示播放器宽度和高度,可以灵活设置;
autostart="true"表示自动播放,autostart="false"表示不自动播放; loop="true"表示连续循环播放,loop="false"表示不循环播放; loop也可以设为一个整数,比如loop="3",表示音乐循环播放3次;
<marquee>
<marquee><strong><font color="#FF0000">前不见古人,后不见来者。</font></strong></marquee>
特殊符号:
如果想在网页中插入“注册商标”、“空格符号”、“版权”等等,这些都属于特殊
符号的范畴。
注册商标:®
空格符号:
版权符号:©
间距及align用来设置图片旁边文本的排列对齐方式
常用值:Top,middle,absmiddle,bottom,left,right,absbottom
<frame>框架标识
要在一个浏览器窗口中显示多个页面,实际上表示一个帧的划分,而frame表示这个划分中的单元。下面是一个简单的框架文件的内容:x
例如2:"
例如2:
属性:
noresize="noresize":滚动条: noresize:默认, auto:自动,yes有,no无.
framespacing="0"边界添充
frameborder="no"边框显示否, yes有,no无.
border="0"边框宽度
<form>表单标识
表单的首要标记是<form>,也是制作表单的第一步,一个页面中可以包含多个表单,而<form>就是它们的分界线,<form>也是表示表单如何工作的重要标记,它有两个重要参数:actiont和method。
*action参数表示表单要提交到的地点,一般为一个CGI程序,如:“http://www.somewhere.com/cgi-bin/talk.pl”(CGI程序可以用各种编程语言编写,如C、VB、Java,这里的.pl为Perl语言)。
*method表示表单发送的方法,有两种:get(默认方法)和post,它们之间略有区别,主要是传输的信息量和接收的接口不同,get有255个字符的限制,而post没有(另一个参数是target,和超链接标识<a>的Target参数用法一样)。
例如:
属性说明: size="10" 字符宽度
maxlength="10"最多字符数
<table>表格标识
表格的表示:<table>表格内容</table>
定义表格标题:<caption…> 标题内容</caption>
定义表格列:<tr …> 表格列内容</tr>
定义表头资料:<th..>表头内容</th>
定义表格内容:<td…>表格内容</td>
1.表格的表示
一对<table>标记是一个table结构的最外层,它有三个重要属性。一个是用来表示表格边框粗细的属性border,属性值取整数,如果省略border属性,则表示不加边框。另一个是用来表示表格宽度的属性width,其属性可取相对值(由一对引号括起来的百分数,表示相对于充满窗口的百分比),也可取绝对值(用整数表示的屏幕像素点的个数,如width=300),缺省值是100%。还有一个属性是cellpading,用来表示每个表项单元的内容与表格边框之间所空开的距离,以屏幕像素点为单位,缺省值是0。
2.定义表格标题
<caption>表格名称</caption>,在一对<caption>标记之间是这张表格的名称信息,它通常被Web浏览器显示在表格上方的中央部位。
3.定义表格列和内容
<tr>定义表格当前行的内容,单标记<tr>表示一个新的表格行(Table Row)的开始。单标记<th>和<td>都表示在表格的当前行里产生一个新的表项单元。
[b]4.一个表格实例[/u]
水平方向:align: center left right
垂直方向:top 顶 middle 居中 bottom 底对齐
a.简单的表格实例:
b.Table通常是由一个表格名称再加上一行或多行的表格内容所构成的块状结构。
例如:
<Th>和<Td>的属性
属 性 描 述
width/height 单元格的宽和高,接受绝对值(如 80及相对值(如 80%)。
colspan 单元格向右打通的栏数
rowspan 单元格向下打通的列数
align 单元格内字画等的摆放贴,位置(水平),可选为:left,center,right。
valign 单元格内字画等的摆放贴 位置(垂直),可选值为: Top, middle, bottom。
bgcolor 单元格的底色
bordercolor 单元格边框颜色
background 单元格 背景图片
www的全称为World Wide Web,即全球广域网(万维网),是一种基于TCP/IP协议的网络信息服务。当WWW服务器接收到请求时,将HTML标记的文本发送给请求者,请求者的浏览器把HTML文本翻译后,显示在窗口中。
HTML简介
下面就一个简单的HTML文件进行解释,使读者对之有一个感性的认识,为以后的学习打下基础。读者可以对照其在浏览器中的显示情况,来了解HTML文件的基本格式、概念和标记。在编辑的文本文件中写出如下内容(可以使用Windows自带的记事本来编写):
<HTML> <head> <title>一个简单的HTML示例</title> </head> <body> 欢迎光临我的主页。 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
通过上面的实例可以发现HTML文件是纯文本文件,是用ASCⅡ码编写的源文件,可以用任何一个文本编辑器(如记事本notepad)打开和编辑。HTML文件包括两部分。
*文件的内容部分
*HTML的标识部分。
大多数HTML标识的书写格式如下:
<标识名>显示内容</标识名>
浏览器的功能是:解释并显示HTML文件。需要注意的是:对于同一个HTML文件,不同的浏览器显示的效果可能不一样。
下面介绍所用的标识:
*<HTML></HTML>标识:任何一个HTML文件都应该以该标识开头和结尾,该标识告诉浏览器使用HTML语言来解释和显示该文件。其他内容都应写在该标识之间。
*<head></head>标识:该标识是网页头部标识。写在该标识之间的内容一般不显示出来,只有后面讲到的<title></ title >标识会显示在浏览器顶部的蓝色标题栏中。
< title ></ title >标识:该标识放置于< head ></ head >标识之间,其中间书写的内容将显示在浏览器的顶部标题栏中,是HTML文件的标题,如上例所示,标题的内容可以任意制定,也可以不写。
*<body></body>标识:网页的主题内容应该放置在该标识之间,而该标识应该放置在<HTML></HTML>标识内部。
<HR>分隔线标识 :别忽视我阿!
<HR>的语法很简单,在需要插入分隔线的位置输入该标识即可,例如现在需要在上一个实例的第一句话后面插入一条分隔线,使之布局全理,可以将其源代码更改如下:
<HTML> <head> <title>一个简的HTML示例</title> </head> <body> 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
<br>行中断标识
在HTML语言中,实现换行是靠一个行中断标识<br>来实现的。
例如可以将上一个实例的源代码修改如下:
<HTML> <head> <title>一个简单的HTML示例</title> </head> <body> 欢迎光临我的主页。 <HR> 这是我第一次做主页。 <br> 无论怎么样,我都会努力做好! </body> </HTML>
元信息标记<meta>
<HEAD>
开始标签
<TITLE>银河信息技术学院</TITLE>
网页文档标题
<meta http-equiv="Content-type" content="text/html; charset=gb2312">
网页文档字符编码设置
<META content=银河,网盾工程,安全资讯,黑客入门,黑客攻防,软件下 name=keywords>
网页文档关键字的设置
<META content=银河信息技术学院。 name=description>
网页文档描述信息的设置
<LINK href="../images/cixicn.css" type=text/css rel=stylesheet>
网页文档链接样式表文件的设置
</HEAD>
结束标签
<meta>标记的主要作用是向服务器和客户端传达关于文档的隐藏信息。
<meta http-equiv="Content-type" content="Text/html; charset=gb2312">
属性说明:
http-equiv:设置或获取用于将 META 标签的 content 绑定到 HttP 响应头的信息。
Content:设置或获取与 HttP-EQUIV 或 NAME 关联的资源信息。
Charset:设置或获取用于解码对象的字符集。
<META content=银河,信息技术学院,网盾工程 name=keywords>
<META content=银河信息技术学院 name=descripTion>
属性说明:
Name:设置或获取META 对象的 CONTENT 标签属性中指定的值。
name值为“keywords”主要设置网站的关键字。
name值为“description”主要设置网站的描述信息。
例如:
<HTML> <head> <META content=银河,信息技术学院,网盾工程 name=keywords> <META content=银河信息技术学院 name=description> <title>一个简的HTML示例</title> </head> <body> 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
<Bgcolor>
例如:
<HTML> <head> <title>一个简的HTML示例</title> </head> <body bgcolor=red> 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
Background
<HTML> <head> <title>一个简的HTML示例</title> </head> <body background =red> 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
<text>
例如:
<HTML> <head> <title>一个简的HTML示例</title> </head> <body background =red text="#00ff00"> 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
Leftmargin 设定页面左边距,Topmargin 设定页面上边距
例如:
<HTML> <head> <title>一个简的HTML示例</title> </head> <body background =red text="#00ff00" Leftmargin="200" Topmargin="200" > 欢迎光临我的主页。 <HR> 这是我第一次做主页,无论怎么样,我都会努力做好! </body> </HTML>
<font>文本修饰标识
先来看一个实例,实例源代码如下:
<HTML> <head> <title>一个简单的HTML示例</title> </head> <body> <font size=6> <font face="隶书"> <font color=red> 欢迎光临我的主页 </font> </font> </font> <HR>
这是我第一次做主页。
<br>
无论怎么样,我都会努力做好!
</body>
</HTML>
1.字号属性 :twisted:
Size属性有1到7个等级,1级的字号最小,7级最大,默认的字号大小是3号(大约相当于Word里的5号,16个像素),可以使用“size=?”定义字号的大小,例如输入下面的代码:
<HTML> <body> <font size=1>这是1号字的效果</font><br> <font size=2>这是2号字的效果</font><br> <font size=3>这是3号字的效果</font><br> <font size=4>这是4号字的效果</font><br> <font size=5>这是5号字的效果</font><br> <font size=6>这是6号字的效果</font><br> <font size=7>这是7号字的效果</font> <body> <HTML>
2.字体属性
Face属性定义的是字体的名称,如中文字体的“宋体”、“楷体”、“隶书”等,可以在写字板和Word等字处理软件中找到不当前系统中安装的字体名称,例如输入以下代码:
<HTML> <body> <font size=5> <font face="宋体">宋体</font><br> <font face="隶书">隶书</font><br> </font> </body> </HTML>
3.颜色属性
Color属于可以用浏览器承认的颜色名称和十六进制数值表示(如<font color=red>或<font color=#808080>)。
<h1>到<h6>
例如:
<HTML> <body> <font size=5> <h1>第一级标题</h1><br> <h2>第二级标题</h2><br> <h3>第三级标题</h3><br> <h4>第四级标题</h4><br> <h5>第五级标题</h5><br> <h6>第六级标题</h6><br> </font> </body> </HTML>
粗体标记<b>\斜体标记<i>\下划线标记 <U>
例如:
<HTML> <head> <title>文字段落的修饰标记</title> </head> <body bgcolor="red" text="#00ff00"> 银河信息技术学院欢迎你!<br> <b>银河信息技术学院欢迎你!</b><br> <i>银河信息技术学院欢迎你!</i><br> <u>银河信息技术学院欢迎你!</u><br> <s>银河信息技术学院欢迎你!</s><br> </body> </HTML>
上标标记 (<SUP>…</SUP>)\下标标记 (<SUB>…</SUB>)
例如:
2<SUP>2</SUP>
银河信息技术学院<SUB>数码组</SUB>
<a>超链接标识
语法:<a>文档</a>
属性:
1.Href 设置文本链接的地址
2.Target 目标窗口打开方式,值为“_blank”是弹窗打开,值为“_self”为自身窗口重定向。
3.Title 是鼠标悬停在链接文本上的文字提示。
现在可以创建一个最简单的链接:
<a href="http://www.sina.com">新浪网</a>
把协议换成"mailto:",如:<a href="mailto:marsz@163.net">给我来信</a>,这样如果点击该链接,系统就会打开默认的E-mail程序进行处理,另一个和它相似是而的协议是"newsgroup:",它将打开默认的信息组程序,用法和打开E-mail类似。
下面以一个具体实例说明:
<HTML> <head> <title>链接标识</title> </head> <body> <a href="http://www.sina.com" target="_blank">新浪网</a><br> <a href="ftp://ftp.leapware.com/pub/myftp.exe" Title=”连接到服务器” >myftp</a><br> <a href="mailto:liuxiaodongxd@163.com">我的信箱</a><br> <a href="telne:bbs.pku.edu.cn">北大bbs</a> <a href="telnet:bbs.tsinghua.edu.cn">清华bbs</a> </body> </HTML>
<Img>图像标识
引用
目前有以下几种图像格式能被Web浏览器直接解释:GIF格式(.GIF文件,支持256色);X位图格式(.XBM文件,黑白图像);JPEG格式(.JPG、.JPEG文件,支持RGB色)。
对于段落中的图像,[u]还可以利用align属性定义图像与文本行的对齐方式,其属性值可取top(与文本行顶部对齐)、middle(中间对齐)、bottom(底部对齐,默认值)、left(将此图显示在窗口左方)、right(将此图显示在窗口右方)。[/u]
用<img>来表示网页中的一幅图像
<h2><img align=middle src="kdx.gif"> This text lineis middle-align.</h2>
如果让图像单独占一块区域,要在图像标记的前后加上<P>或<BR>标记:
<p><img src="kdx.gif"><p>This image is stand al onewith the text.<p>
例如在网页中插入一个名字为kdx.jpg的图像,宽度为100个像素,高为120个像素,则输入:
<img src="kdx.jpg"width="100"height="120"alt="暴躁猪的猪圈">
还可以在图像上设置超级链接,其标记为<A></A>:
<a href=http://www.lilacsoft.com/>
<img src="kdx.jpg" width="100" height="120" alt="暴躁猪的猪圈" border=2>
</a>
Web浏览器在超链接图的四周显示一个边框,以示可被触发。若想去掉这个边框只需在<img>中加上属性border=0就可以了。
段落标记<P>…</P>与换行标记<br>
<HTML> <head> <title>段落标记</title> </head> <body> <p> <h1>夜归鹿门山歌</h1> <h4>孟浩然</h4> 山寺钟鸣昼已昏,渔梁渡头争渡喧。<br> 人随沙路向江村,余亦乘舟归鹿门。<br> 鹿门月照开烟树,忽到庞公栖隐处。<br> 岩扉松径长寂寥,惟有幽人自来去。<br> </p> <p> <h1>登幽州台歌</h1> <h4>陈子昂</h4> 前不见古人,后不见来者。<br> 念天地之悠悠,独怆然而涕下!<br> </p> </body> </HTML>
水平线标记<hr>
插入一条水平线
属性:Color 颜色的定义 如:color=#ff0000 红色
Size 粗细的定义 如:Size=5
Width 宽度的定义 如:width=500像素 宽度的单位有两个,像素(像素)或%(百分比)
<HTML> <head> <title>段落标记</title> </head> <body> <p> <h1>夜归鹿门山歌</h1> <h4>孟浩然</h4> 山寺钟鸣昼已昏,渔梁渡头争渡喧。<br> 人随沙路向江村,余亦乘舟归鹿门。<br> 鹿门月照开烟树,忽到庞公栖隐处。<br> 岩扉松径长寂寥,惟有幽人自来去。<br> </p> <hr color="#FFaa00" width="500" size="5" > <p> <h1>登幽州台歌</h1> <h4>陈子昂</h4> 前不见古人,后不见来者。<br> 念天地之悠悠,独怆然而涕下!<br> </p> </body> </HTML>
居中标记<center>…</center>
居中标记从文本意义上理解就是居中对齐,凡是放在<center>开始标记和</center>结束标记中的内容,无论是文本还是图片或者是表格等等都可以实现居中显示。
<HTML> <head> <title>段落标记</title> </head> <body> <center> <p> <h1>夜归鹿门山歌</h1> <h4>孟浩然</h4> 山寺钟鸣昼已昏,渔梁渡头争渡喧。<br> 人随沙路向江村,余亦乘舟归鹿门。<br> 鹿门月照开烟树,忽到庞公栖隐处。<br> 岩扉松径长寂寥,惟有幽人自来去。<br> </p> <hr color="#FFaa00" width="500" size="5" > <p> <h1>登幽州台歌</h1> <h4>陈子昂</h4> 前不见古人,后不见来者。<br> 念天地之悠悠,独怆然而涕下!<br> </p> </center> </body> </html>
预先格式化标记<pre>…</pre>
<HTML> <head> <title>预先格式化标记</title> </head> <body> <h1>夜归鹿门山歌</h1> <h4>孟浩然</h4> <pre> 山寺钟鸣昼已昏,渔梁渡头争渡喧。 人随沙路向江村,余亦乘舟归鹿门。 鹿门月照开烟树,忽到庞公栖隐处。 岩扉松径长寂寥,惟有幽人自来去。 </pre> </body> </html>
无序列表:
无序列表标记符<UL></UL>和列表项标记符<LI></<LI>
<HTML> <head> <title>无序列表</title> </head> <body> <ul> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> </ul> </body> </html>
有序列表:
有序列表标记符<OL></OL>和列表项标记符<LI></LI>
<HTML> <head> <title>无序列表</title> </head> <body> <ol> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> </ol> </body> </html>
OL 标记符具有两个常用的属性:type 和 start,分别用来设置数字序列样式和数字序列起始值。start 属性的值可以是任意整数, type 属性的值如下表所示3-5-3.23:
例如:
<HTML> <head> <title>有序列表</title> </head> <body> <ol type=”A”> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> </ol><br> <ol start=”3”> <li>银河信息技术学院</li> <li>银河信息技术学院</li> <li>银河信息技术学院</li> </ol><br> <ol > <li>银河信息技术学院</li> <li value="5">银河信息技术学院</li> <li>银河信息技术学院</li> </ol><br> <ol > <li>银河信息技术学院</li> <li type="a">银河信息技术学院</li> <li>银河信息技术学院</li> </ol><br> </body> </html>
引用
声音和视频
Web浏览器自身不能解释声音和视频文件,但它能通过其他辅助工具的帮助来播放声音和视频文件。一般声音文件带有.WAV、.AU、SND等文件扩展名,而视频文件带有.AVI、.MPG等文件扩展名。
<h2><a href="沉默的羔羊.avi">这是一段电影</a>.</h2>,用户触发这段超级链拉后,Web浏览器会立即启动默认的网络视频播放工具程序,如Media Player程序来播放“沉默的羔羊”视频文件。
背景音乐的插入方法很多,在这里我们只介绍两种:
第一种:
<bgsound src="file:///F://mp3/爱情转移.wma" loop="1">
<bgsound src="your.mid">
属性设置:
因为bgsound嵌入的音频文件在网页中没有控件显示,所以在使用bgsound时,它的各个属性就必须加以设置。
1.自动播放:
语法:autostart=true、false
说明:该属性规定音乐文件是否在下载完之后就自动播放。
True:音乐文件在下载完之后自动播放;
false:音乐文件在下载完之后不自动播放。
示例:<bgsound src="your.mid" autostart=true>
<bgsound src="your.mid" autostart=false>
2.循环播放:
语法:loop=正整数或infinite
说明:该属性规定音乐文件的循环次数。
第二种:
<embed src=音乐链接地址 width=200 height=50 type=audio/mpeg loop="true" autostart="true">
代码说明:
支持的音乐格式: wma、mp3、rm、ra、ram、asf,尽量选用可连接性高的音乐链接,保证音乐可以顺利播放;
width和height表示播放器宽度和高度,可以灵活设置;
autostart="true"表示自动播放,autostart="false"表示不自动播放; loop="true"表示连续循环播放,loop="false"表示不循环播放; loop也可以设为一个整数,比如loop="3",表示音乐循环播放3次;
<marquee>
<marquee><strong><font color="#FF0000">前不见古人,后不见来者。</font></strong></marquee>
特殊符号:
如果想在网页中插入“注册商标”、“空格符号”、“版权”等等,这些都属于特殊
符号的范畴。
注册商标:®
空格符号:
版权符号:©
间距及align用来设置图片旁边文本的排列对齐方式
常用值:Top,middle,absmiddle,bottom,left,right,absbottom
<HTML> <head> <title>有序列表</title> </head> <body> <img src="5.jpg" width="100" height="120" alt="暴躁猪的猪圈" border=2 hspace="100" vspace="110" align="middle">fdvfdgdgd </body> </html>
<frame>框架标识
要在一个浏览器窗口中显示多个页面,实际上表示一个帧的划分,而frame表示这个划分中的单元。下面是一个简单的框架文件的内容:x
例如2:"
<html> <head> <title>无标题文档</title> </head> <frameset cols="80,*" frameborder="no" border="0" framespacing="0"> <frame src="5.jpg" name="leftFrame" scrolling="No" noresize="noresize" title="leftFrame" /> <frame src="5.jpg" name="mainFrame" title="mainFrame" /> </frameset> <noframes><body> </body> </noframes> </html>
例如2:
<html> <head> <title>无标题文档</title> </head> <frameset rows="70,*" cols="*" framespacing="0" frameborder="yes" border="0" bordercolor="#FF0000"> <frame src="top.html" name="topFrame" frameborder="no" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" /> <frameset cols="191,*" frameborder="no" border="0" framespacing="0"> <frame src="life.html" name="leftFrame" frameborder="no" scrolling="auto" noresize="NORESIZE" id="leftFrame" title="leftFrame" /> <frame src="main_2.html" name="mainFrame" frameborder="no" id="mainFrame" title="mainFrame" /> </frameset> </frameset> <noframes><body> </body> </noframes></html>
引用
属性:
noresize="noresize":滚动条: noresize:默认, auto:自动,yes有,no无.
framespacing="0"边界添充
frameborder="no"边框显示否, yes有,no无.
border="0"边框宽度
<form>表单标识
表单的首要标记是<form>,也是制作表单的第一步,一个页面中可以包含多个表单,而<form>就是它们的分界线,<form>也是表示表单如何工作的重要标记,它有两个重要参数:actiont和method。
*action参数表示表单要提交到的地点,一般为一个CGI程序,如:“http://www.somewhere.com/cgi-bin/talk.pl”(CGI程序可以用各种编程语言编写,如C、VB、Java,这里的.pl为Perl语言)。
*method表示表单发送的方法,有两种:get(默认方法)和post,它们之间略有区别,主要是传输的信息量和接收的接口不同,get有255个字符的限制,而post没有(另一个参数是target,和超链接标识<a>的Target参数用法一样)。
引用
内部控件被分成了三大类:textarea、select和input。
textarea 表示可以输入多行的文本框,有两个参数:rows表示文本框的行数,cols表示文本框的列数,例如:<textarea name="tl"cols=40 rows=7>请您留言</textarea>
表示宽40列、高7行的文本输入框。
select 元素可以表示成一个下拉式的选择框,可以对其中的元素进行选定,它的参数有size和multiple,size如果等于1,则以下拉框显示,如果大于1,则以滚动框显示,multiple表示可以多选,它没有值。Select中的选项用option表示,iptionr的value属性表示选项的名称,是给CGI程序识别的,而“<option value=o l>……”中的“……”的内容则是给浏览器识别看的,另一个属性是selected,它表示表单在初始化时即有默认选项被选定。例如:
<select name=hobby size=6 multiple>
<option value=music selected>音乐
<option value=sports>运动
<option value=reading>读书
<option value=collection>收藏
<option value=art>艺术
<option value=writing>写作
</select>
textarea 表示可以输入多行的文本框,有两个参数:rows表示文本框的行数,cols表示文本框的列数,例如:<textarea name="tl"cols=40 rows=7>请您留言</textarea>
表示宽40列、高7行的文本输入框。
select 元素可以表示成一个下拉式的选择框,可以对其中的元素进行选定,它的参数有size和multiple,size如果等于1,则以下拉框显示,如果大于1,则以滚动框显示,multiple表示可以多选,它没有值。Select中的选项用option表示,iptionr的value属性表示选项的名称,是给CGI程序识别的,而“<option value=o l>……”中的“……”的内容则是给浏览器识别看的,另一个属性是selected,它表示表单在初始化时即有默认选项被选定。例如:
<select name=hobby size=6 multiple>
<option value=music selected>音乐
<option value=sports>运动
<option value=reading>读书
<option value=collection>收藏
<option value=art>艺术
<option value=writing>写作
</select>
例如:
<body> <form id="form1" name="form1" method="post" action=""> <label>姓名: <input name="textfield" type="text" size="10" maxlength="10" /> </label> <br /> <label>个人简历 <textarea name="textarea" cols="50" rows="5"></textarea> </label><br> 性别: <label> <input type="radio" name="radiobutton"/> 男</label> <label> <input type="radio" name="radiobutton" /> 女</label><br> 爱好: <label> <input type="checkbox" name="checkbox"/> 读书</label> <label> <input type="checkbox" name="checkbox"/> 上网</label> <label> <input type="checkbox" name="checkbox"/> 打篮球</label> <label> <input type="checkbox" name="checkbox"/> 睡觉</label><br> <label> <select name="select"> select:下拉列表 <option>初中</option> <option>高中</option> <option>大学</option> <option>博士</option> <option>工程师</option> </select> </label> </form> </body>
属性说明: size="10" 字符宽度
maxlength="10"最多字符数
<table>表格标识
引用
表格的表示:<table>表格内容</table>
定义表格标题:<caption…> 标题内容</caption>
定义表格列:<tr …> 表格列内容</tr>
定义表头资料:<th..>表头内容</th>
定义表格内容:<td…>表格内容</td>
1.表格的表示
引用
一对<table>标记是一个table结构的最外层,它有三个重要属性。一个是用来表示表格边框粗细的属性border,属性值取整数,如果省略border属性,则表示不加边框。另一个是用来表示表格宽度的属性width,其属性可取相对值(由一对引号括起来的百分数,表示相对于充满窗口的百分比),也可取绝对值(用整数表示的屏幕像素点的个数,如width=300),缺省值是100%。还有一个属性是cellpading,用来表示每个表项单元的内容与表格边框之间所空开的距离,以屏幕像素点为单位,缺省值是0。
2.定义表格标题
引用
<caption>表格名称</caption>,在一对<caption>标记之间是这张表格的名称信息,它通常被Web浏览器显示在表格上方的中央部位。
3.定义表格列和内容
引用
<tr>定义表格当前行的内容,单标记<tr>表示一个新的表格行(Table Row)的开始。单标记<th>和<td>都表示在表格的当前行里产生一个新的表项单元。
[b]4.一个表格实例[/u]
引用
属性:
属 性 描 述
width 表格的宽度
height 表格的高度
align 表格在页面的水平摆放位置
background 表格的背景图片
bgcolor 表格的背景颜色
border 表格边框的宽度(以像素为单位)
bordercolor 表格边框颜色
bordercolorlight 表格边框明亮部分的颜色
bordercolordark 表格边框昏暗部分的颜色
cellspacing 单元格之间的间距
cellpadding 单元格内容与单元格边界之间的空白距离的大小
属 性 描 述
width 表格的宽度
height 表格的高度
align 表格在页面的水平摆放位置
background 表格的背景图片
bgcolor 表格的背景颜色
border 表格边框的宽度(以像素为单位)
bordercolor 表格边框颜色
bordercolorlight 表格边框明亮部分的颜色
bordercolordark 表格边框昏暗部分的颜色
cellspacing 单元格之间的间距
cellpadding 单元格内容与单元格边界之间的空白距离的大小
水平方向:align: center left right
垂直方向:top 顶 middle 居中 bottom 底对齐
a.简单的表格实例:
<html> <head> <title>html表格实例</title> </head> <body> <center> <table border=1 width="408"> <caption>表格实例</caption> <tr><th height="32" colspan="4" align="center">成绩表</th> </tr> <tr align="center"><td>姓名</td><td>性别</td><td>班级</td><td>成绩</td></tr> <tr align="center"><td>张磊</td><td>男</td><td>ATP</td><td>99</td></tr> <tr align="center"><td>吴燕</td><td>女</td><td>ATP</td><td>97</td></tr> <tr align="center"><td>刘芳</td><td>女</td><td>ATP</td><td>100</td></tr> <tr align="center"><td>徐石</td><td>男</td><td>ATP</td><td>98</td></tr> </table> </center> </body> </html>
b.Table通常是由一个表格名称再加上一行或多行的表格内容所构成的块状结构。
<html> <head> <title>html表格实例</title> </head> <body> <table border=2 cellspacing=4 cellpadding=10> <caption>表格实例</caption> <tr> <th rowspan=6>备注</th> <th colspan=5>英语成绩</th> </tr> <tr> <th rowspan=6><ahref="mailto:liuxiaodong@163.com">分数查询</a><th> </tr> </tr> <tr><td>80</td><td>90</td></tr> <tr><td>85</td><td>93</td></tr> </table> </body> </html>
例如:
<html> <head> <title>html表格实例</title> </head> <body> <center> <table width="408" border=5 bordercolor="#FF0000" bordercolordark="#00FF00" bordercolorlight="#0000FF"> <caption>表格实例</caption> <tr><th height="32" colspan="4" align="center" bgcolor="#FF0000">成绩表</th> </tr> <tr align="center"><td bgcolor="#00FF00">姓名</td> <td bgcolor="#00FFFF">性别</td> <td bgcolor="#CCFF00">班级</td> <td bgcolor="#FFCC00">成绩</td> </tr> <tr align="center"><td bgcolor="#00FF00">张磊</td> <td bgcolor="#00FFFF">男</td> <td bgcolor="#CCFF00">ATP</td> <td bgcolor="#FFCC00">99</td> </tr> <tr align="center"><td bgcolor="#00FF00">吴燕</td> <td bgcolor="#00FFFF">女</td> <td bgcolor="#CCFF00">ATP</td> <td bgcolor="#FFCC00">97</td> </tr> <tr align="center"><td bgcolor="#00FF00">刘芳</td> <td bgcolor="#00FFFF">女</td> <td bgcolor="#CCFF00">ATP</td> <td bgcolor="#FFCC00">100</td> </tr> <tr align="center"><td bgcolor="#00FF00">徐石</td> <td bgcolor="#00FFFF">男</td> <td bgcolor="#CCFF00">ATP</td> <td bgcolor="#FFCC00">98</td> </tr> </table> </center> </body> </html>
<Th>和<Td>的属性
引用
属 性 描 述
width/height 单元格的宽和高,接受绝对值(如 80及相对值(如 80%)。
colspan 单元格向右打通的栏数
rowspan 单元格向下打通的列数
align 单元格内字画等的摆放贴,位置(水平),可选为:left,center,right。
valign 单元格内字画等的摆放贴 位置(垂直),可选值为: Top, middle, bottom。
bgcolor 单元格的底色
bordercolor 单元格边框颜色
background 单元格 背景图片
发表评论
文章已被作者锁定,不允许评论。
-
添加过滤器的配置方法
2010-08-23 08:25 754引用方法: 1、写个类实现Filter接口 实现3个方法: p ... -
如何使用fileupload工具来实现文件上传
2010-08-17 14:07 10041。需要两个夹包文件: commons-fileupload- ... -
jsp中a标签?传参,参数怎么获取页面当中文本框的值
2010-08-16 16:50 9487引用<input type="text&quo ... -
个人感觉这个DAO实例写的还可以吧??呵呵
2010-08-14 13:23 744package org.tarena.shopping.d ... -
Session技术的理解
2010-08-12 20:38 808引用3、Session技术 (1)什么是session ... -
cookie如何使用??
2010-08-12 13:53 10042、cookie技术 (1)什么是cookie? 是 ... -
浏览器cookie的学习与测试
2010-08-12 11:24 725生成cookie: package web; imp ... -
学web很容易迷惑的问题
2010-08-11 15:00 591get只有一个流,参数附 ... -
总结response/request/DoGet/DoPost
2010-08-11 14:49 1283引用1.Response [JSP] JSP中的隐藏对 ... -
servlet中service doGet doPost 的联系和区别
2010-08-11 14:44 1846在servlet中默认情况下,无论你是get还是post ... -
servlet处理表单的doGet和doPost
2010-08-11 14:37 957service() 是在javax.servlet.S ... -
在JSP页面及servlet的doGet()方法中处理汉字乱码的问题
2010-08-11 14:34 1992在doPost()方法中使用过滤器(所有编码方式为过滤器中设置 ... -
Servlet中doGet与doPost的区别
2010-08-11 14:31 1463Serlvet接口只定义了一个服务方法就是service,而H ... -
Servlet中doGet(),doPost(),service()函数的关系
2010-08-11 14:28 11011,三者之间的关系:doGet()和doPost()是由函数 ... -
对象的产生4种方法
2010-08-10 13:22 641引用 对象的产生到底有多少种方法了: · 直接用new关键字 ... -
servlet课堂笔记
2010-08-09 20:10 762引用 1、servlet的生命周 ... -
如何避免浏览器访问数据库出现乱码问题
2010-08-06 16:09 1046引用 mysql 创建 数据库时指定编码很重要,很多开发者都使 ... -
get/post提交怎么判别如何使用
2010-08-05 19:39 2492引用 get/post方式: get方式: ... -
手动生成servlet的一个实例方法
2010-08-05 17:01 900引用 Servlet 1、什么是S ... -
JSP和asp内置对象
2010-06-26 19:29 867引用JSP内置对象(9个常用的内置对象) 引用JSP共有以下9 ...
相关推荐
它详尽地介绍了每个标签的用法、属性及注意事项。通过实践和查阅资料,开发者可以熟练掌握HTML,从而创建出功能丰富、用户体验优秀的网站。 总结,HTML标签是构建网页的基础,理解和熟练运用各种标签能有效提升网站...
### HtmlEncode与HtmlDecode编码及解码用法详解 #### 一、HtmlEncode与HtmlDecode概念解析 在Web开发中,经常会遇到需要处理HTML代码的情况。为了确保网页内容的正确显示以及防止潜在的安全威胁(如XSS攻击),...
如果方法返回的是 `MvcHtmlString` 类型,则通常需要使用等号 (`=`) 来输出结果,因为这表明该方法的输出可以直接插入到页面中,而不会被转义。例如: ```csharp <%= Html.ActionLink("链接文本", "ActionName", ...
这篇名为“checkbox用法小结”的博客文章可能涵盖了复选框的基本用法、HTML/CSS/JavaScript实现、以及可能涉及到的前端框架如Bootstrap或jQuery的相关知识。以下是对这些知识点的详细阐述: 1. HTML复选框基础: -...
HTML标签和属性总结 HTML标签是构建Web页面的基础,了解HTML标签的属性和使用方法是非常重要的。本文将详细介绍HTML标签...本文总结了HTML标签的种类、属性和使用方法,希望能够帮助初学者更好地学习和理解HTML语言。
### Web服务器控件与HTML服务器控件的区别及用法 #### 概述 在ASP.NET开发过程中,开发者经常需要在项目中使用各种控件来构建动态网页。在这些控件中,有两种常见的类型:Web服务器控件(WebControls)与HTML...
实验内容涉及HTML框架的使用,这是构建网页布局的一种方法。HTML框架允许我们将一个页面分割成多个独立的区域,每个区域可以加载不同的内容。在本实验中,学生需要创建一个名为`index.html`的静态页面,页面布局应...
1.4 本章小结 12 第2章 HTML 5的常用元素与属性 14 2.1 HTML 5保留的常用元素 15 2.2 HTML 5增强的iframe元素 34 2.3 HTML 5保留的通用属性 40 2.4 HTML 5新增的通用属性 44 2.5 HTML 5新增的结构元素 48 2.6...
本文将详细讲解这个库的核心概念、功能及使用方法。 一、Simple HTML DOM解析库简介 PHP Simple HTML DOM解析库,正如其名,是一个专为PHP设计的HTML文档对象模型解析工具。它的主要优点是简单易用,可以快速地对...
### Wireshark常用用法总结 #### 一、Wireshark简介 Wireshark是一款强大的网络包分析工具,被广泛应用于网络安全分析、故障排查、性能优化等领域。它能够捕获并解析网络通信中的数据包,提供详细的协议分析及丰富...
本文将深入探讨如何在MVC3中处理反复提交,并全面介绍`HtmlHelper`的用法及其拓展方法。 一、处理反复提交 在ASP.NET MVC中,一种常见的处理反复提交的方法是使用"POST-Redirect-GET"(PRG)模式。当用户成功提交...
通过本文的学习,我们不仅了解了`html2canvas`的基本使用方法,还深入探讨了在实际应用过程中可能遇到的一些问题及其解决策略。合理运用这些技巧,可以帮助开发者更高效地完成前端截图功能的开发工作。需要注意的是...
JavaScript 中 document 对象用法小结 JavaScript 中的 document 对象是一个非常重要的对象,它提供了大量的属性和方法来操作 HTML 文档。下面是对 document 对象的一些常用属性和方法的总结。 属性 1. `document...
这些示例展示了如何使用`TextBox`方法来创建不同类型的文本框输入字段,包括不带初始值的文本框、带有模型绑定和自定义样式的文本框等。 #### 六、总结 以上介绍的`ActionLink`、`RouteLink`、`BeginForm`和`...
### HTML标题标签与使用规范 #### 一、HTML标题标签定义 HTML中的标题标签由`<h1>`至`<h6>`组成,用于定义不同级别的标题。这些标签主要用于文档结构中的不同层次的标题,例如文章标题、章节标题等。 #### 二、...
CSS用法总结,介绍了css基本语法、盒子模型、选择器等等,还介绍与html文档结合使用的方式,通过css的使用实现Html显示页面更加美观,另外附带CSS的参考文档(帮助文档)。
本文旨在基于站长多年的实践经验,全面总结FSO组件的使用方法,为用户提供一个详尽的技术指南。尽管无法覆盖FSO的所有细节,但本文将聚焦于其基本使用、核心方法和实用案例,以满足日常开发需求。 #### 二、FSO组件...
总结起来,“html引入html实例”涵盖了HTML中嵌入、链接以及动态引入其他HTML文件的各种方法。这些技术在构建大型网站和实现页面模块化时非常有用,可以帮助我们提高代码复用性和维护性。理解并熟练掌握这些技术对于...