迈出网页制作的第一步－－看懂HTML源代码

仁武君 · 发表于 2004-10-25 17:27:00

。。如果你正在学习网页制作，就一定会跟HTML打交道。虽然有很多编辑工具可以简化操作，避开复杂的网页代码，但是想要成为一名真正的网页设计师，学好HTML、看懂网页代码才是迈向成功的第一步
。。HTML，中文译为超文本标记语言。简单理解为某些字句加上标志的语言，从而实现预期的特定效果。作为一套标记语言，基本上只要明白各种标记的用法就算学会了HTML。
。。HTML的语法格式分为嵌套与非嵌套两类，嵌套格式为<标记>...</标记>，非嵌套只为<标记>。此外，根据标记的不同，有的标记附带有属性参数，则表示为<标记属性＝"参数值">，根据个人需要，可添加或者去掉相应的属性标记。
。。一、基本框架
。。如同人一样，网页也包括了“头部”和“身体”，其中<html>...</html>整个网页文档，<head>...</head>头部，<body>..</body>是身体，总的标记为<html><head>...</head><body>..</body></html>
。。<head>标记内包含着诸如网页标题、语言编码、网页描述等基本信息，而平时我们真正见到的网页内容均入在<body>标记内，现在先介绍一下<head>里的基本信息。
。。网页标题（标记格式为<title></title>）
。。创建网页标题文字：<title>标题</title>//此处书写的文字会显示在IE的标题栏上。
。。网页文档信息（标记格式为<meta>）
。。描述网页内容类型：<meta http-equiv="Content-Type" content="text/html; charset=gb2312">//该页面为TXT文本或HTML格式，语言编码方式为GB2312（即简体中文）。
。。描述网页的关键字信息：<meta name="keywords" content="这里是关键字">
。。对网页的详细描述：<meta name="description" content="这里是对该网页的介绍">。
。。刷新网页：<meta http-equiv="refresh" content="5;UBL=xxx.htm">//5秒钟后刷新，并链接到xxx.htm。
。。二、组成要素
。。无论网页如何千变万化，构成一个网页内容的最基本要素大体只有五种，即文字、图片、表格、超链接和表单控件，所以下面将围绕着这五个要素逐一列举介绍。
。。文字（标记格式为<font></font>）
。。指定文字字体：<font face="宋体">宋体文字</font>.
。。指定文字大小：<font size="3">3号文字</font>
。。指定文字颜色：<font color="#FF0000">红色文字</font>//网页颜色采用16位编码，因此#FF0000表现为红色。大家可以查阅相关资料了解其它颜色的编码。
。。图片（标记格式<img>）{/B]
。。<img src="images/pic.jpg" width="400" height="300" border="2" align="center">//src指定为路径地址，width为宽度，height为高度，border为边框大小，align为横向位置。
。。表格（标记格式为<table><tr><td></td></tr></table>）
。。<table width="400" height="300" border="1" align="center" cellpadding="2" ceellspacing="2" bgcolor="#FF0000"><tr><td>此处添加文字或图片等</td></tr></table>//width、height、border、align与以上的例子作用一样，cellpadding为边框与单元格的间距，cellspacing为单元格之间的间距，bgcolor为表格背景色。
。。以上所介绍的元素都是只存在当前页中，而网页超链接的出现大大改变了人们的浏览习惯，可根据自己喜好，点击到相关链接查看网页信息。
。。超链接（标记格式为<a></a>)
。。<a href="xxx.htm" title="提示文字">链接文字或图片</a>//href为被点击后的链接页，title为鼠标停在链接文字或者图片上后出现的提示文字。
。。表单控件（标记符号为<input>、<textarea></textarea>、<select></select>)
。。表单控件实现了人与网页的交互，象大家常去的论坛、购物站点等都有它的“身影”
。。密码框：<input type="password">
。。单选框：<input type="radio">
。。复选框：<input type="check">
。。提交按钮：<input type="submit">
。。重置按钮：<input type="reset">
。。隐藏按钮：<input type="hidden">
。。文本域：<textarea rows="6" cols="30"></textarea>//rows为行数，cols为宽度。
。。列表框：<select><option>项目1<option>项目2<option>项目3</select>

。。。。。。。。。。。。。。。摘自《电脑报》星之海洋

仙界晓楠 · 发表于 2004-10-25 17:52:00

请教制作网

仁武君 · 发表于 2004-10-27 09:25:00

你终于挤上来了呀。

边防武警 · 发表于 2004-11-2 23:32:00

呵呵~~~~~~专门找个有这个功能的不就是更好了吗?直接有代码了啊~~~~★★★★★★★★★★★★★★◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆

迈出网页制作的第一步－－看懂HTML源代码

站长推荐 /1