HTML个人总结_第1页
HTML个人总结_第2页
HTML个人总结_第3页
HTML个人总结_第4页
HTML个人总结_第5页
已阅读5页,还剩8页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、HTML网站开发的主要原则是: 用标签元素HTML描述网页的内容结构; 用CSS描述网页的排版布局; 用JavaScript描述网页的事件处理,即鼠标或键盘在网页元素上的动作后的程序HTML(Hyper Text Mark-up Language 超文本标记语言)的缩写,是最基础的网页语言 。 Html是通过标签来定义的语言,代码都是由标签所组成 。Html代码不用区分大小写 。Html代码由<html>开始</html>结束。里面由头部分<head>

2、;</head>和体部分<body></body>两部分组成。标签:是由一对尖括号<>和标签名称组成。标签分为“起始标签”和“结束标签”两种,二者的标签名称是相同的,只是结束标签多了一个斜杠“/”在元素的起始标签中,可以包含“属性”来表示元素的其他特性<标签名 属性名='属性值'> 数据内容 </标签名>              

3、0;   <标签名 属性名='属性值' />多个属性时:<hr  size=“3”  align=“left”  width=”75%”>用空格分开Html 的命名:文件的扩展名要以.html或.html结束。Ø 文件名中只可由英文字母、数字或下划线组成。Ø 文件名中不要包含特殊符号,比如空格、$等所有标记都要用尖括号(<>)括起来,这样,浏览器就可以知道,尖括号内的标记是HTML命令

4、。任何空格或回车在代码中都无效,插入空格或回车有专用的标记,分别是 、<br>。因此,不同的标记间用回车键换行再编写是个不错的习惯。 title元素:文件标题声明  link元素和style元素常用于CSS  script元素用于脚本 meta元素 元信息 <base> 超链接网址基准参考点 <meta> 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。name 属性:网页

5、的描述信息。当取keywords时,content属性的内容就作为搜索引擎的关键字进行搜索。http-equiv 属性:模拟HTTP协议的响应消息头。 body元素是html文件的主体元素,它包含所有要在网页上显示的各种元素 。        设置页面背景:bgcolor        设置背景图片:background       &#

6、160;设计正文颜色:text设置页面边距:topmargin、leftmargin、                          rightmargin、bottomnargin             

7、; 设置显示内容与浏览器的距离添加空格 <b>  </b> 粗.<i>  </i>斜 <s>  </s> 删<u>  </u> 下划<sub>  </sub> 下标          <sup>&#

8、160; </sup> 上标           .<address>  </address> 地址        自动倾斜  .<big>  </big> 大字<strong>  </strong>

9、60;加强语气 ( 加粗 <em>.</em> 加强语气 ( 倾斜 段落缩进<blockquote>设置水平线<hr>向中对齐 <center> 格式: <center>  </center>插入定义列表<dl><dl>  <dt>名称</dt>      <d

10、d>说明</dd>      <dd>说明</dd>      <dd>说明</dd>  <dt>名称</dt>      <dd>说明</dd>     <dd>说明</dd>   

11、;  <dd>说明</dd>  </dl>插入无序列表<ul><ul>  <li>项目名称</li>  <li>项目名称</li>  <li>项目名称</li>  <ul><ul>:符号标签()type属性:disc     ( 默认)  &#

12、160;    circle                square  <ul type="circle">插入有序列表<ol><ol>  <li>项目名称</li>  <li>项目名称</li>  &

13、lt;li>项目名称</li>  </ol>超链接概述链接在网页制作中是一个必不可少的部分,在浏览网页时,单击一张图片或者一段文字就可以弹出一个新的网页,这些功能都是通过超链接来实现的,在HTML文件中,超链接的建立是很简单的,但是掌握超链接的原理对网页的制作是至关重要的。在学习超链接之前,需要先了解一下“URL”,所谓URL(Uniform Resource Locator)指统一资源定位符,通常包括三个部分:协议代码、主机地址、具体的文件名超链接标签的使用创建超链接的标签为<a>和</a>,使用格

14、式如下:<a href=“资源地址”   target=“是否在新窗口显示”   title=“指向链接时显示的文字”>链接名称</a>链接路径 绝对路径:包含了标识Internet上的文件所需要的所有信息,包括完整的协议名称、主机名称、文件夹名称和文件名称。格式为:通信协议:/服务器地址:端口号/文件位置/文件名http:/ww.相对路径:是以当前文件所在路径为起点,进行相对文件的查找。链接到同一文档的某个部分 锚记标签用于使用户“跳”到文档的某个部分  HT

15、ML 的 NAME 属性用于创建锚标记  <A NAME = “marker”>主题名称</A><A HREF= “#marker”>主题名称</A>为达到这种跳转效果,请在 HREF 参数中使用该标记B 发送E-mail:在html页面中,可以建立e-mail链接,当浏览者单击链接后,系统会启动默认的本地邮件服务系统发送邮件,格式为:<a href=“mailto:e-mail地址?subject=邮

16、件主题”>描述文字</a><a href=“mailto:zhangsan?subject=一个消息”>联系我</a>LINK 颜色的设置 基本格式:<body link=”颜色” alink=”颜色” vlink=”颜色”> link 超链接尚被选中的文字 alink 超链接点选但未被放开的颜色 vlink 超链接已被点选过的颜色插入并格式化图像B <img>标签:用于在网页中插入图像内容。

17、0;src属性:用于设置图像文件的相对或绝对URL地址。 共三种类型:GIF:是图形和图片的最佳格式,适用于透明或动画图形。 JPG或JPEG:更适合存放照片 PNG:拥有许多JPEG与GIF的共同优点,所以最近越来越流行。通过设置width属性和height属性可以控制图像的显示宽度和高度,他们的长度单位可是百分比,也可是像素。 <a href="URL"><img src="URL"></a>注意点:边框的问题.可通过border=“0”去掉边框属性名称&

18、#160;                      属性值                        说明Align 

19、60;                        left               图像靠左文字靠右Right       

20、0;图像靠右文字靠左Top        文字往上靠middle         文字靠中bottom  文字靠下空隙设置Vspace   垂直上下两端和物件距离Hspace  水平左右两端和物件距离设置图像映射图像地图:<map>map标签要和img标签联合使用。<img src=”URL” usemap=”>&

21、lt;/img><map name”><area shape=” cords=” , , , ” href”URL”></map>语法说明<img>标记表示插入图像文件,src表示插入图像的路径;Ø  <map>标记表示插入图像映射;Ø  <area>标记表示图像映射区域;Ø  rhape属性表示映射区域形状:   &#

22、160;  “rect”表示矩形区域;      “circle”表示椭圆形区域;      “poly”表示多边形区域;Ø  cords表示感应区域的坐标创建表格 <BODY><TABLE BORDER = 2 > <TR>   <TD>姓名</TD>  &

23、#160;<TD>性别</TD>   <TD>分数</TD> </TR> <TR>  <TH>姓名</TH>   <TH>性别</TH>   <TH>分数</TH>   <TH>表示行或列标题,粗体显示  </TR> .</TABLE&

24、gt;<TH align="center">性别</TH>居中COLSPAN=“n” 属性表示跨多少列 ROWSPAN=“n” 属性表示跨多少行 表格的颜色设置:表格的背景色 <TABLE bgcolor=颜色值> 行的背景色<TR bgcolor=颜色值>    列的背景色  <TD bgcolor=颜色值>表格的尺寸设置:<TABLE &

25、#160; width=n1   height=n2> frame常见属性  规定表格周围的哪一侧的边框是可见的。 rules常见属性   规定水平或垂直的分界线。   注释:必须与 "border" 属性配合使用!定义表格列的分组。通过此元素,您可以对列进行组合以便进行格式化。 <colgroup span="3" bgcolor=“red”>&l

26、t;/colgroup>Span:表格的直列数,而不是第几列。 定义某个表格中针对一个或多个列的属性值。您只能在表格或 colgroup 中使用此属性。<table>   <col></col>    代表第1列  <col span=“2” bgcolor=“red”></col>   代表第2,3 两列  <tr>.

27、</tr>单元格间距,边距<table cellspacing=” cellpadding=“”>表格嵌套在HTML文件中,第一个<table>标记表示插入第一表格,第二个<table>标记插入在标记<td></td>之间,表示在单元格中插入表格,也就是嵌套表格。框架标签框架就是把一个浏览器窗口划分为若干个小窗口,每个窗口可以显示不同的URL网页。所有的框架标签要放在一个HTML文档中,HTML页面的文档体标签<body>被框架集标签<frameset>所取代,然后通过<f

28、rameset>的子窗口标签<frame>定义每一个子窗口和子窗口的页面属性。B <frameset>标签<frameset rows=“框架窗口高度,框架窗口高度,”></frameset> <html><head>   <title>框架的基本结构<title></head><frameset>   <frame>   <fram

29、e></frameset></html><frameset cols=“框架窗口宽度,框架窗口宽度,”></frameset> 还可设置的属性包括:frameborder:是否显示框架结构的边框线,取值为0、1或yes、no。取值为1或yes边框将会显示,取值为0或no边框将会隐藏。framespacing:默认边框线的宽度为1,该属性可调整边框线的宽度。(以像素为单位)bordercolor:可设置边框线颜色。scrolling:设置框架是否显示滚动条。取值为yes、no或auto。yes表示滚动条一直显示;no表示无

30、论什么情况都不显示滚动条;auto是系统的默认值,它是根据内容来调整的,当页面长度超过浏览器窗口的范围时就会自动显示滚动条。B <noframes>标签如果遇到不支持框架结构的浏览器,此时就需要用到该标签来设置替换的内容,并告诉浏览者其浏览器无法打开框架页面。<a href=“right1.html” target=“mainFrame”>新闻中心</a>使用iframe进行页面内的页面嵌套可以定义嵌套页面的大小、位置等用法:<iframe name=“ifra1” scr=“abc.htm” 

31、;border=“1”/>可以通过name属性将链接的显示目标定位到iframe框架内。 <bgsound> 是用以插入背景音乐,但只适用於 IE,其参数设定不多。如下 <bgsound src="your.mid" autostart=true loop=infinite>  src="your.mid" 设定 midi 档案及路径,可以是相对或绝对 autostart=true 是否

32、在音乐档传完之後,就自动播放音乐。true 是,false 否 (内定值)。  loop=infinite 是否自动反覆播放。LOOP=2 表示重复两次,Infinite 表示重复多次。  <EMBED> 是用以插入各种多媒体,格式可以是 Midi、Wav、AIFF、AU 等等,Netscape 及 新版的 IE 都支援。其参数设定多。如下  <EMBED src="y

33、our.mid" autostart="true" loop="true" hidden="true">  src="your.mid" 设定 midi 档案及路径,可以是相对或绝对 autostart=true 是否在音乐档传完之後,就自动播放音乐。true 是,false 否 (内定值)。  loop="true" 是

34、否自动反覆播放。LOOP=2 表示重复两次,true 是, false 否。  HIDDEN="true" 是否完全隐藏控制画面,true 为是,no 为否 (内定)。  STARTTIME="分:秒" 设定歌曲开始播放的时间。如 STARTTIME="00:30" 表示从第30秒处开始播放。  VOLUME="0-100" 设定量的大小

35、,数值是0到100之间。内定则为使用者系统本身之设定。  WIDTH="整数" 和 HIGH="整数" 设定控制画面的宽度和高度。(若 HIDDEN="no") ALIGN="center" 设定控制画面和旁边文字的对方式,其值可以是 top、bottom、center、baseline、 left、right、texttop、middle、absmiddle、absbottom。 controls=&qu

36、ot;smallconsole" 设定控制画面的外貌。预设值是 console。 console 一般正常的面板 smallconsole 较小的面板 playbutton 只显示播放按钮 pausecutton 只显示暂停按钮 stopbutton 只显示停止按钮 volumelever 只显示音量调整钮 <Marquee>滚动的文字</Marquee> Direction=”滚动方向”left左ri

37、ght右up上down下 Behavior=”滚动方式” scroll一圈一圈绕着走 slide只走一次 alternate来回的走 Loop=”滚动的循环次数” 若未指定则循环不止(loop=”infinite”) Bgcolor=”背底颜色”Width=“宽度”Height=“高度” onMouseOver=”this.stop()”onMouserOut=”this.start()” Scrollamount=”速度” 数值越大速度越快  Scrolldelay=“延时

38、”(走一步,停一停) 表单Form <form action=处理表单信息的服务器端应用程序 method=处理表单数据的方法(POST/GET) name=表单名称 target=打开窗口的方式> 表单元素 </form文本框 <input name=“文本框名称” type=“text” value=“初始值” size=“显示字符数” maxlength=“最多容纳字符数”> 密码框 <inpu

39、t name=“文本框名称” type=“password” value=“初始值” size=“显示字符数” maxlength=“最多容纳字符数”> 多行文本框 <textarea name=“多行文本框名称” cols=“每行中的字符数” rows=“显示的行数”>  初始内容 </textarea>单选框、复选框 单选框 <input name=“单选框名称” type=“radio

40、” value=“选择名称” checked(初始状态,如果为默认,则写checked;否则不写)> 复选框 <input name=“复选框名称” type=“checkbox” value=“选择名称” checked(初始状态,如果为选中,则写checked;否则不写)>列表框(A)、菜单式  <select name=“列表框名称”> <option selected(哪个为初始选择,就添加selected语句只有一个)&

41、#160;value=“提交值”>列表1</option> <option value=“提交值”>列表2</option> <option value=“提交值”>列表3</option> . </select> (B)、列表式 <select name=“列表框名称” size=“显示的行数” multiple(如果允许多选,则有该命令;否则没有此命令)> <option

42、60;selected(哪个为初始选择,就添加selected语句可有多个,但没有意义) value=“提交值”>列表1</option> <option value=“提交值”>列表2</option> <option value=“提交值”>列表3</option> . </select>下拉菜单 <B>谁是 2002 年世界杯冠军?</B><SELECT NAME =“myselect"><OPTION SELECTED>西班牙</OPTION><OPTION>法国</OPTION><OPTION>巴西</OPTION><OPTION>德国</OPTION></SELECT>按钮 <input type=“按钮类型(reset、submit、button)” name=“按

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论