HTML编程基础

通常情况下,人们应用dreemwcave以可视化的方式设计网页。而直接用html标记符设计网页的情况则较少,对html标记符也了解不多,但在动态网页设计中,常常需要利用asp代码摘出网页的部分htm l代码,此时必须熟悉html标记符,因此,本章将对常用的htmi标记符进行介绍。
1. 1. 1什么是html
html(街pertext markup language)即超文本标记语育,是一种用来在www (world wide web) l表示信息的描述性的标记语言。
html文本是由html标记组成的描述性文本。html标记可以描述文字、图形、动网、声音、表格、链接等。生成一个htmi文本述常可以通过以下四种方法:
i)利用各种文本编辑器(如windows记事本)i is接使用html语言编写。
2)借助一钱htmi.的编辑工其,如fronipage、hotdog等。
3)其他格式的文档(如word文档)转换成html文本。
4)山web服务器端实时动态地生成。
下面应用第一种方法完成一个简单的实例
1. 1.2一个简单的htm 1.实例
i例1-1)创建一个简单的网贞,步骤如下:
1)选择“开始”一“程序”,“附件”一“记事本”命令,打开记事本程序。翰人以
下html代码
<htmi)
<head>
< title > i itm l实例</title>
</head)
< body bgcolor = "#ffffff">
<p》这是一个简单的html实例</p>
</body>
</htmi>
2)选择“文件.菜单下的“保存,命令.打开“保存”对话框,在输人文件名和文件扩展名(1-1. him),选择合适的目录.然后单击“保存”
3)在浏览器中打开运行该文件(1-1. him),运行结果如图1-1所示。
从以上过程可以看出,使用html语言确实能够很容易地制作网页,但是这样的网页距离关观实用的要求显然还有一定差距。因此后面的章节将会详细地介绍如何利用html诸言的其他标记符来修饰文字和图像等页面元素。
1.2 html常用标记
标记符是html语言中定义网页内容格式和显示的指令.制网贞内容的显示效果。
1.2.1页面基本属性标记
而标记符的属性用于进一步控制网页的内容多么丰富、版式多么复杂,网页的基本结构却都是一样的。
1.网页的基本结构
如下所示:
<html>
<head)
< title>文档标题<,title》
</head>
< body>
这是htmi文档的主要部分
</body>
</html>
html的结构包括头部(head)、主体(body)两大部分.其中头部描述浏览器所需的信息,而主体则包含页面的具体内容及格式说明。
2.语官字符维,(charsets)的信息
<meta http-equiv ="content-type" content="text/html;charset=#">
#=us-ascii,iso-8859-i,x-mac-roman, 150-8859-2, x-mac-ce, iso-2022-jp, x-sjis,x-euc-jp, euc-kr, iso-2022-kr, gb2312, gb_ 2312-80, x-euc-tw, x-cns11643-1,x-cnsi 1643-2, big5
可在html文件中设置mime字符集(i息。您在浏览主页时.最好自己在浏览器的选项菜单内选择相应的语言(language encoding),但是如果html文件里写明了设置,浏览器就会自动设置语言选项。如果主页里用到了字符实体(entities),则该主页就应该写明字符集信息,否则,您在浏览该主页时,若未正确设置语言选项,显示将可能混乱。
3.背.色彩和文字色影
设置网贞的背景色彩和文字色彩可通过设置body标记的属性来实现,具体格式如下:
<body rgcolor=# text=#link# alink=# vlink=#>
body标记各参数的含义见表1-l
4.添加注释
由于web站点需要经常更新,而且制作时往往是几个人合作,所以创建的页面必须易于维护,而添加增强文件可读性的重要手段。
html中的注释是由<!一(开始标记符)和一>(结束标记符)组成的。这两个标记符中间的内容就是注释的内容,它们不会在浏览器中显示。
5.画线
在网页中产生分隔线可用<hr>标记来实现,其用法为:
<hr width=宽度值size=线的高度align,=对齐方式noshade>
属性说明:
i) width用于指定分隔线的宽度.宽度优的指定方式有两种.一是用像素点来指定,
例如.若要产生宽度为500像素的直线,则实现代码为:
<hr width=500>
另一种方法是用百分比表达,例如,若要产生宽度是网页宽度的75%分隔线,则实现代码如下:
<hr width二.75%.>
2) si,用于指定直线的高度。例如.要绘制宽度为80%,高度为l的直线,则实现代
码如下:
<hr width ="80%" size=1>
3) align指定直线的对齐方式,取值有left、center、right。
4) noahade指定直线是否有阴形。如果带有该参数,则直线无阴影。
<hr>标记一般用于产生水平分隔线,若要产生竖直线,可将width设置为1, size设置为竖直线的高度谊。例如:< hr width= i size= 500 noshade >
1.2.2文字属性标记
文字是网页中最主要的页面元素,html语言提供了一些用来修饰文字的标记符,可以川它们来设置文字的字体、颜色、大小和样式等属性。
1.字体控制
<font >标记符是用来控制文字的字体、大小和颜色的。其语法格式为:
<font face=“fonlname" size=“fontaize" color="#rrgcbb">文本</font>
属性说明:
face属性用于指定字体;size用于指定字体的大小;color用于设置字体的颜色。字体大小的表达方法有两种,一是设置为绝对字号,此时的设置优可以是1~7, 1号最小,7号最大,默认字号为3,可利用< basefont size=字号>设置或更改默认字号。例如,若要以绿色,宋体4号字输出“html实例”,则实现代码为:
< font face=“宋体”size=4 color=“#008000">html实例</font >
另一种设置为相对字号大小,此时的用法为<font size=±n>,其中n代表字号改变的量,+表示字体在默认字号的基础上增大字号,- 表示在默认字号的基础上递减字号。例如:
< basefont size=3)
<font size= +2>html实例</font >
2.标题的字号
语法格式为:
< hn)</hn>
说明:n是1 -6的数字,<hi>表示最大的标题,<h6>表示最小的标题。在默认状态下,<hn>标记符中的文字在浏览器中显示时都是黑体,而且文字将自动在</hn>标记符后换行。
【例1-2】在网页中分别用六级标题标记符拍出一个侧试效果的文本。
<html >
<head >
<title>标越字体演示</title》
</head >
<body bgcolor = " #ffffff" text=“#000000”>
<hl>这是第一级标题</h1>
<h2》这是第二级标肠</h2>
<h3>这足第三级标题</h3>
<h4>这是第四级标肠</h4 >
<115》这是第五级标题</hs>
<h6>这是第六级标题</h6&g
上一个:PC网站与手机网站有什么区别
下一个:北京网站建设中的网页设计技巧!
宁武网站建设,宁武做网站,宁武网站设计