




版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、第一部分 页面设计语言 HTML简介一、HtmlHTML(Hyper Text Markup Language 超文本标记语言)是一种用来制作超文本文档的简单标记语言,用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如UNIX,WINDOWS等)。自1990年以来HTML就一直被用作World Wide Web上的信息表示语言,用于描述网页的格式设计和它与WWW上其它网页的连结信息。HTML语言是通过各种标记(tags)来标识文档的结构以及标识超链接的信息。虽然HTML语言描述了文档的结构格式,但并不能精确地定义文档信息必须如何显示和排列,而只是建议Web浏览器(如IE
2、,Netscape等)应该如何显示和排列这些信息,最终在用户面前的显示结果取决于Web浏览器本身的显示风格及其对标记的解释能力。这就是为什么同一文档在不同的浏览器中展示的效果会不一样。二、页面制作软件简介HTML文档(即网页的源文件)是一个设置了标记的ASCII文本文件,通常它用.html或.htm作为文件的扩展名,由于是普通的文本文件,只要支持文本编辑的软件,都可以编辑html文件,常用HTML文档编辑器主要有以下三种: 手工直接编写,例如 用windows附件的记事本编辑 简单的HTML的编辑工具,如editplus等带有特定菜单和标记颜色的编辑器。 所见即所得的页面编辑器,如frontp
3、age ,dreamwaver等,既可在页面上设计,又可以编辑源文件的专门编辑器。三、html语法1. 页面框架html文件以一对标记来设置不同的显示效果,格式为:<标记名></标记名> 。【基本的框架结构格式】<HTML><HEAD> <TITLE> 页面标题 </TITLE></HEAD><BODY> 浏览器正文信息和相关的标记在这里.</BODY></HTML>【说明】 <html> </html>标记作为文件的起点和终点,浏览器只对两个<
4、html> </html>之间的文字和标记进行解释,并显示有相应的效果。 <head> </head>标记之间设置html文档的头部信息,如用户信息,标题,关键词等 <body> </body>标记设置html文件的主体信息,包括正文、图形、表格、链接、表单等信息。2. 字体字体设置有两种格式,标题字体和普通正文字体【标题字体】<hn> </hn> n=1,2,3,4,5,6【正文字体】<font size=n color=#></font> n=1,2,3,4,5,6,7【说明】
5、 标题字体1号最大,6号最小,一般用来设置标题,有自动换行的功能。 正文字体1号最小,7号最大,一般设置正文的字体,还可以设置文字的颜色,颜色部分参照后面关于颜色的介绍。3. 图像【图像格式】<img src=“图像文件名” width=n height=n>【说明】 <img> 用来设置在页面中显示的图像,它比较特殊,只有开始,没有结束标记。 src参数用来指明图像的文件名,常用的图形格式文件有jpg文件和gif文件。 可选参数 width,height 用来设置图像在浏览窗口所占的宽度和高度。4. 链接(a1.htm)【链接格式】<a href=”URL或网页
6、文件” target=”> 链接文字 </a>【说明】 一对<a></a> 用来设置在页面中超链接信息。 浏览时光标移动到链接文字处变成手形,单击后指向href设定的URL网址或页面。 可选参数target用来设定新的页面在什么窗口显示,这部分内容跟多窗口界面关系比较大。target的值为: _self: 链接的页面在页面显示,默认设置。 _blank 链接的页面在新的浏览窗口显示 _parent 链接的页面在当前窗口的父窗口显示 _top 链接的页面在整个浏览窗口显示 name 链接的页面在指定的name窗口显示5. 表格(a2.htm)【表格格式】
7、<TABLE><TR><TD></TD><TD></TD></TR></TABLE>【说明】 一对<TABLE></TABLE>标记指明里面要显示的内容以表格的形式出现,但是默认的情况下是没有表格边界线的,需要加参数border=1 或大于1的值。表格每增加一行,需加一对<TR></TR>标记表格每增加一列,需加一对<Td></Td>标记,表格中要显示的文字必须放在<Td></Td>标记之间。 <T
8、ABLE>、<TD>都有可选参数width,height用来设定表格或某列的宽度和高度,align参数设置文字的对齐方式。6. 表单(a3.htm)HTML表单用来选择不同种类的用户输入。【表单格式1】<FORM METHOD=POST ACTION="act.php"></FORM>【表单格式2】<INPUT TYPE="#" NAME="">【表单格式3】<TEXTAREA NAME="" ROWS="" COLS="&q
9、uot;></TEXTAREA>【表单格式4】<select> <option></select>【说明】 在网上填写的注册单,查询等信息都是通过一对<form></form>标记来设置的,method参数设置变量传递方式,选post 或get ,action参数设置用户提交输入信息后,处理这些信息的程序的文件名。 <input>标记的参数type取不同的值,可以设置文本框、密码框、单选框、复选框等信息。Type的值效果Text文本框Password密码框Radio单选框Check复选框Reset重选按钮
10、Submit发送按钮Button命令按钮Hidden隐藏项File文件浏览框<TEXTAREA>标记设置多行编辑区域,参数rows设置行数,cols设置列数。 <select>标记设置下拉框,<option>设置下拉框中每一项的值7. 多窗口(框架)【多窗口格式】<FRAMESET ROWS="," COLS=","><FRAME SRC="" NAME=""><FRAME SRC="" NAME="">
11、</FRAMESET>【说明】 <FRAMESET>标记设置多窗口,参数rows,cols只能二选一,rows表示把窗口上下分,cols表示把窗口左右分。 <FRAME>标记设置窗口每部分要显示的页面信息,参数src设置页面文件名,参数name设置每个小窗口的名字,该名字与链接的target部分相对应。8. 其他【文字居中格式】 <CENTER></CENTER>【文字加粗,斜体,下划线】<B>加粗文字</B><I>斜体文字</I><U>下划线文字</U>【换行格
12、式】<p>或<br>【标尺线格式】<Hr>9. 颜色html语言中颜色有两种表示方式 RGB 数码颜色,格式为rrggbb,分别表示红、绿、蓝的颜色值,每一位用16进制数码表示,每种颜色从00ff ,表示这种颜色从无到最深,三种颜色混合在一起,组成一个新的颜色。 预定义色彩单词,用英文单词表示所代表的颜色。Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua四、页面制作实例1 例子1【a1.htm
13、源文件】<html><HEAD><TITLE>网址 </TITLE></HEAD><BODY BGCOLOR="#CCFFFF"><CENTER> <IMG SRC="p1.JPG"> <H1>广东著名大学网址</H1></CENTER><FONT SIZE="4" ><a href="" target="_self">广东外语外贸大学 &l
14、t;/A><P><a href="" target="_parent">中山大学</A><P><a href="" target="_blank">华南理工大学</A><P><a href="" target="ab">华南师范大学</A><P></FONT></BODY></HTML>【效果】2 例子2【a2.ht
15、m源文件】<HTML><HEAD><TITLE> 表格 </TITLE></HEAD><BODY BGCOLOR="#FFFFFF"><TABLE border=2 width=300><TR><Th>姓名</Th><Th>数学</Th><Th>语文</Th><Th>英语</Th></TR><TR><TD>张三</TD><TD>
16、;90</TD><TD>89</TD><TD>78</TD></TR><TR><TD>李四</TD><TD>88</TD><TD>99</TD><TD>96</TD></TR></TABLE></BODY></HTML>【效果】3 例子3【a3.htm源文件】<HTML><HEAD><TITLE> 表单</TITLE>&l
17、t;HTML><HEAD><BODY BGCOLOR="#FFFFFF"><h1><CENTER>注册个人信息</CENTER></h1><FORM METHOD=POST ACTION="">学号:<INPUT TYPE="text" NAME="number" value="" size=11 maxlength=11 ><BR>姓名:<INPUT TYPE="t
18、ext" NAME="name" value="" size=8 maxlength=8 ><BR>密码:<INPUT TYPE="password" NAME="password" value="" size=10 maxlength=10 ><BR> 性别:<INPUT TYPE="radio" NAME="sex">男<INPUT TYPE="radio" NA
19、ME="sex" checked>女<BR>爱好:<INPUT TYPE="checkbox" NAME="favor1">音乐<INPUT TYPE="checkbox" NAME="favor2" checked>美术<INPUT TYPE="checkbox" NAME="favor3" checked>体育<INPUT TYPE="checkbox" NAME=&quo
20、t;favor4">舞蹈<P>文件:<INPUT TYPE="file" NAME=""><P>学院<select name="department" size=1><option>英文学院<option>东语学院<option>西语学院<option>经贸学院<option>商管学院<select><BR>个人介绍:<BR> <TEXTAREA NAME="detail" ROWS=&
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2024年电镀行业重金属监测合规考核试卷
- 市场承包经营合同(标准版)
- 学校商店供货合同(标准版)
- 买卖继续合同(标准版)
- 城建指挥部工作总结
- 综合解析人教版八年级物理《运动和力》章节测试试题(解析版)
- 重难点解析人教版八年级物理上册第6章质量与密度-密度章节测评试卷(解析版含答案)
- 陈学智心电图课件
- 2025年建筑学结构测试题及答案
- 2024年省燃气经营企业从业人员考试(压缩天然气场站工)仿真试题及答案
- 2025营养指导员考试真题库(含答案)
- 2024年新青岛版(六三制)六上科学全册知识点
- DL∕T 1987-2019 六氟化硫气体泄漏在线监测报警装置技术条件
- 2024年云南楚雄州楚雄市事业单位选调30人历年高频考题难、易错点模拟试题(共500题)附带答案详解
- 中医护理方案分析总结优化
- 化妆品购销合同电子版完整版(2篇)
- 轴流风机的维护守则和周期
- 第三章 金属的塑性
- 珠宝设计iPad绘制技法基础到进阶教程
- 《后滚翻》教学课件
- 公安机关业务技术用房建设标准
评论
0/150
提交评论