




版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、1、 <html>和</html> 标签限定了文档的开始和结束点。属性:(1) dir: 文本的显示方向,默认是从左向右(2) lang: 表示整个文档中所使用的语言,en-英文,zh-中文(3) version:定义创作文档的HTML的标准版本2、 <head></head>用于封装位于文档头部的其他标签属性:(1) dir:文本的显示方向(2) Lang:语言信息(3) Profile:提供了与当前文件相关联的文档数据的URL可放在<head>标签中的标签为(1) <base>:标注当前文档的URL的全称属性:Href
2、:指定文档的基础URL地址(<body>中的相对地址都是以此基地址为基础)Target:定义打开页面的窗口属性值:_parent:在上一级窗口中打开_blank:在新一窗口中打开_self:在本窗口中打开_top:在浏览器的整个窗口中打开(2) <basefont>:设定基准的字体,字号和颜色属性:Face:设置字体(如黑体,楷体等)Size:设置大小(属性值从17,从小到大)Color;字体颜色(值为十六进制颜色)(3) <title>:设定显示在浏览器左上方的标题内容属性:Dir:文本的显示方向Lang:语言信息(4) <meta>:有关文档
3、本身的元素信息属性:http-equiv: 生成http标题域,取值与content的属性值相同属性值:Refresh 为自动刷新,在content里设定刷新时间,content里也可以跟上刷新的URL,实现页面跳转;content-type 在content里用charset设置内码语系如charset=gb2312;Expires 定义网页有效期,在content里的格式为星期,日 月 年 时 分 秒 GMT,用英文和数字Page-enter 进入网页时的效果Page-exit 退出网页时的效果在content中对应的值为:0:盒状收缩1:盒状展开2:圆形收缩3:圆形展开4:向上擦除5:向
4、下擦除6:向左擦除7:向右擦除8:垂直百叶窗9:水平百叶窗10:横向棋盘式11:纵向棋盘式12:溶解13:左右向中部收缩14:中部向左右展开15:上下向总中部收缩16:中部向上下展开17:梯状左下展开18:梯状左上展开 19:梯状右下展开20:梯状右上展开 21:随机水平线22:随机垂直线23:随机Name:如果元数据是以关键字/取值出现的话,那么name的值就是其关键字属性值:Keywords 在content里定义关键字;Discription 为定意描述,在content里定义描述内容;Author 在content里描述作者;Content: 关键字/取值的内容(5) <styl
5、e>:设定有关CSS层叠样式表的内容(6) <link>:设定外部文件的链接(7) <script>:设定文件脚本的内容3、 <body></body>界定了文档的主题属性:(1) 、text: 页面文字的颜色(2) 、bgcolor: 页面背景的颜色(用十六进制的颜色表示)(3) 、background: 页面的背景图像(所需的是图片的URL)(4) 、bgproperties: 页面的背景图片是否固定(其只有一个值fixed,设为Fixed后图像不会随着滚动条的滚动而动)(5) 、link: 页面默认的链接颜色(6) 、alink: 鼠
6、标正在单击时的链接颜色(7) 、vlink: 访问过后的链接颜色上面三个控制的是标签<a></a>中的颜色(8) 、topmargin: 页面的上边距 (9) 、leftmargin: 页面的左边距4、 定义空格 <!-被注释掉的内容->5、 文字标记(1) 、<hn>(n=16)标记标题字属性:Dir:文字方向Lang:语言信息Align:对齐方式属性值:Left:左对齐(默认)Right:右对齐Center:居中Class:用一个名称来标记标题,标记名称指向在外部定义的样式表Id:为段落设置一个标记,将来可以在一个超链接中
7、明确的引用这个标记,以便作为样式表的选择器Style:创建标题内容的内联样式Title:给标题加上一个说明性的文字(2) 、<font>标记普通字属性:Face:字体size: 字号color:颜色(3) 、<b>或<strong>粗体(4) 、<i>,<em>,<cite>斜体(5) 、<sup>上标(6) 、<sub>下标(7) 、<big>大字号(8) 、<small>小字号(9) 、<u>下划线(10) 、<s> 删除线(11) 、<ad
8、dress>显示地址如Email6、 段落标记(1) 、<p> 表示一个段落的开始属性:dirlangalignclassidstyletitle(2) 、<br> 换行 <nobr>属性:class idstyletitle(3) 、<div>分块文字属性:dirlangalignclassidstyletitlenowrap(强制不换行) (4)、<span> 行内样式定义属性: dirlangalignclass id style title(5) 、<center> 水平居中显示属性:dir langclas
9、s idstyletitle(6) 、<blockquote> 块引用属性: dir langclassidstyletitle7、 下划线<hr>插入水平分割线属性:dirlangclassidstylealign sizenoshadewidthcolor8、 列表(1) 、 <ul>无序列表,用<li>来罗列项目属性:dirlangclassidstyletitlecompact(紧凑无需列表)type(项目符号类型)Type的属性值:disc:实心原点circle:空心原点square:实心方形(2) 、<ol>定义一个有序列
10、表属性:dirlangclassidstyletitlecompactstart(数字起始值)Type的属性值:1,A,a,i,|(3) 、目录列表<dir>,无序列表的一种特殊形式属性: dir langclassidstyletitle(4) 、定义列表<dl>基本用法:<dl><dt>名词</dt> <dd>解释</dd></dl>属性:dirlangclassid styletitlecompact(5) 、菜单列表<menu>,用于表示简短的列表属性:dirlangclassi
11、dstyletitle9、插入图片<img> 插入图片标签属性:Src:图像的源文件路径Alt:文字提示(图像不显示时)width、hight:宽度、高度border:边框Vspace:垂直间距hspace:水平间距dynsrc:设定avi文件的播放loop:设定avi播放次数Loopdelay:设定avi播放延迟start:设定avi文件的播放方lowsrc:设定低分辨率图片usemap:映像地图DirlangclassidalignstyletitleAlign的属性值极其说明:Top:文字的中线在图片的上方middle:文字的中线位于图片的中部Bottom:文字的中线位于图片
12、的底部left:图片在文字左侧Right:图片在文字的右侧absbottom:文字的底线位于图片的底部Absmiddle:文字的底线位于图片的中部baseline:英文文字基准线对齐Texttop:英文文字上边线对齐10、 插入超链接(1)、标签<a></a>为超链接标签属性:Href:指定链接地址name:给链接命名target:指定链接打开窗口accesskey:链接热键Dirlangalignclassidstyletitlecharsetrel:指定从原文档到目标文档的关系Rev:指定从目标文档到源文档的关系typetabindex:对新窗口中的对象重新排序UR
13、L格式:http:/进入万维网站点进入文件传输服务器news:/启动新闻讨论组telnet:/启动telnet方式Gopher:/访问gopher服务器mailto:/启动邮件(href=”mailto:/? Subject=给我来信”)(2) 、书签链接,试用于页面太长时,避免翻页,格式如下<a name=”name”> 文字 </a><a href=”#name”> 文字链接 </a>(3)、空链接: <a href=”#”> 链接 </a>(4)、脚本链接:<a href = “javascript:.”>
14、; 文字链接 </a>(5)、制作图像映射:在同一图像上嵌入不同的链接,创建图像映射的方式是通过<img>标签的usemap属性再结合<map> 以及<area>标签来实现的,<a>或<area>标签包含在<map>标签内<map>的属性: name 给链接命名 dir langidclassstyletitle<area>的属性:Hrefaltaccesskeytargetdir langidclassstyletitletabindexshape(图像映射区域的形状)coords(图
15、像对光标敏感区域的坐标)Shape的属性值:Rect 矩形区域circle 椭圆形区域poly 多边形区域事例:<img usemap=”#map” src=”URL” hight=” width = “” border = “”><map name = “map”> <area shape = “rect” coords = “100,23,56,90” href = “URL”><area shape = .></map>11、 插入多媒体(1) 、插入声音标签<bgsound>属性: src (声音文件路径) loo
16、p 循环次数(2) 、<embed>标签可以在网页中加入MP3音乐,电影,swf动画等多媒体文件属性: srcloopautostartwidthhighthidden(是否隐藏内嵌播放器) dir lang class id stylealigntitletype(嵌入多媒体类型)Hidden 和 autostart 的属性值有true和no当嵌入flash动画时还有以下属性:Quality 动画的播放质量puginspage 播放插件所在位置 wmode 动画播放时的窗口模式(3) 、制作滚动字幕标签<marquee></marquee>属性:align
17、behavior(滚动方式) bgcolorclassdirection(滚动方向)widthhight Hspace vspaceStyleloop scrollamount(滚动速度) scrolldelay(滚动延迟)Direction的属性值:updownleftrightBehavior 的属性值: scroll(循环往复默认)slide(只走一次滚动)alternate(交替进行滚动)Scrollamount后跟数字越小越慢,scrolldelay后跟毫秒,vspace和hspace 定义字幕与周围文字的距离12、 其他嵌入(1) 、<object>标签用于往文档中嵌入
18、对象属性:classid(指定包含对象的位置)archive(URL列表) bordercodebase(提供一个可选的插件URL)hightWidth data(指定需要对象处理的数据文件) hspace vspacename type tabindex dir lang alignclass idstyletitle(2) 、<applet>标签用来插入applet小程序属性:code(指定浏览器运行的Java类小程序的名称)codebasehightwidthhspacevspace nametype class altid title stylealign(3) 、<
19、param>标签为把包含他的<object>或<applet>提供参数属性:type name id value13、 表单:表单由一个或多个文本输入框、可单击的按钮、多选框、下拉菜单和图像按钮等组成,所有的这些都放在<form>中(1) 、<form>属性: dirlangalignclassidstyletitlename method(定义表单结果从浏览器传输到服务 器的方法一般有post 和get 两种方法)action(用来定义表单处理程序(asp,CGI等)的位置(相对或绝对))enctype(设置表单编码方式) target(
20、表单返回显示方式)Enctype的属性值:text/plain(以纯文本形式传送) application/x-(默认编码方式)multipart/form-data 使用mine 编码(2) 、表单输入标签<input>属性:dirlangclassidaltnamealignstyletitletypeaccesskey value size srcaccept(文件上传的MIME表列)checked(已选中)disabled(禁止某个元素输入)maxlength(最大字符数)Type的属性值:text 文字域 password密码域file 文件域checkbox复选框rad
21、io单选框button 普通按钮submit 提交按钮reset 重置按钮hidden隐藏域 image 图像提交按钮(3)、多行文字域<textarea>属性:dirlangclassidstyletitlenameaccesskeydisabledtabindex rows(行数)cols(列数)wrap(多行文字域的换行)Wrap的属性值:virtual 虚拟换行physical 物理换行 off 不换行(4) 、<select>下拉菜单和下拉列表标签,把标记条目放在<option>标签中属性:dirlangclassidstyletitlenamed
22、isabled(禁用某个列表)size tabindexmultiple(列表中的多选项目)14、 表格(1) 、定义表格<table>属性:dirlangclassidstyletitlenamebgcolorbackgroundbordercolorbordercolorlightbordercolordarkborderheightwidthcellpadding(单元格边距)cellspacing(单元格间距)nowrapframe(表格边框的可见方式)rules(行列之间边的可见方式)summary(整个表格的概要描述)Frame的属性值:Above 显示上边框below
23、显示下边框border 边框全显示hside显示上下边框vside显示左右边框lhs显示右边框rhs显示左边框void显示Rules的属性值:All显示所有内部边框cols仅显示列边框groups显示位于行列间的边框none不显示内部边框rows仅显示行边框(2) 、定义行<tr>属性:dirlangclassidstyletitlebgcolorbackground bordercolorlight bordercolordarkvalign(表格行的垂直对齐方式)(3) 、定义列<td>,<th>为定义表头属性:dirlangclassidstyleti
24、tlebgcolorbackgroundbordercolorlightbordercolordarkvalignwidthheightabbr(单元格的缩写)axis(用逗号分割目录名列表)rowspan(单元格跨行个数)Colspan(单元格跨列个数) headers(标题单元格的列表)nowrap(禁止换行)scope(指定单元格提供信息)(4)、表格标题内容<caption>属性:dirlangclassalignidstyletitlevalign15、 框架主要分为两部分:一个是框架集,另一个是框架(1) 、<frameset>框架集,仅是一个框架的集合属性
25、:classidstyletitlerowscolsbordercolorframeborderframespacing(框架集间距)(2) 、定义框架<frame>属性:classidstyletitle bordercolor frameborder namenoresize(禁止调整边框大小) src(框架源文件)Marginwidth(框架边缘宽度)marginheight(框架边缘高度)Frameborder的属性值:yes 出现边框no 不出现边框(3) 、<iframe>定义内联框架,在文档中定义一个独立的矩形区域,有独立的滚动条和边框属性:classid
26、styletitleframebordernamesrcmarginwidthmarginheightalignheightwidthscrolling(是否允许出现滚动条)Scrolling的属性值:yes 出现 no不出现auto自动出现滚动条16、 样式表(1) 、内联样式表:只需在标签内含一个上style属性,style属性后在跟一系列属性和属性值即可。事例:<标签 style = “属性:属性值”>(2) 、文档样式表用<style>标签表示属性:dirlangtitlemedia(文档要使用的媒介类型)type(样式类型)级联样式表type的属性值都是tex
27、t/css,javascript使用的样式表都是text/javascriptMedia的属性值:screen 计算机显示屏(默认) tv(电视) projection 剧场 handheld(PDA和手提电话)print 打印all所有媒体(3) 、外部样式表:用<link>标签来实现属性:dirtitlelangtargettypeclassidstylecharsethrefmediarelrev(4)/样式表语法(a)、HTML重新定义标签样式表语法:exp:tdcolor:red;font-size:8pt(b)、类样式表:能够在文档样式表或外部样式表中为同一个元素创建不
28、同的样式,在文档后面通过设置class属性来选择特定的样式。例子: .bg background-image: url(路径);<bodyclass = ”bg”>17、样式表的属性(1) 、字体属性:font-family 用一个指定的字体名font-size 字体显示的大小font-style 字体显示的样式font-weight 定义字体的粗细font-variant 设置英文大小写转换 font 组合设置字体属性Font-style的属性值:normal 正常值italic 斜体oblique 扁斜体Font-weight的属性值:normal 正常值bold 粗体bold
29、er 在加粗lighter 变细100900 共有100到900个级别数越大越粗Font-variant的属性值:normal 正常 small-caps 将小写转换为大写Font组合时的顺序:样式,粗细,大小(2) 、颜色和背景属性:Color 颜色 background-color 背景颜色background-image 背景图片background-repeat 背景图片如何重复Background-position 设置背景图片水平和垂直的位置background 组合设置背景属性属性值:Background-repeat:repeat 平铺repeat-x X方向上平铺repeat
30、-y Y方向上平铺 no-repeat不平铺Background-position:value 以百分比(x%.y%)或绝对值的形式(x.y)来确定背景图像的位置top 居顶Center 居中bottom居底left 居左right居右Background可以任意组合以上的属性值(3) 、文本属性:Letter-spacing 定义一个附加在字符间的间隔数量 word-spacing单词间的间隔数量 text-index文字的首行缩进Text-align 文本对齐方式line-height行高间隔text-transform控制英文文字大小写 text-decoration文字修饰属性值:Le
31、tter-spacing: normal 正常值长度单位 如2emWord-spacing : normal 正常值长度单位Text-decoration:underline 加下划线 overline 加上划线 line-through 加删除线 blink闪烁文字,只使用于 netscape浏览器 none默认值Text-align:left 左对齐right右对齐center居中justify两端对齐Text-index:后跟长度单位如2emText-transform: capitalize将每个单词首字母大写uppercase 将每个都转换为大写 lowercase 转换为小写 no
32、ne(4) 、边框属性:Border-color 边框颜色 border-style 边框样式 border-width边框宽度 border-top-color 上边框颜色Border-left-color 左边框颜色 border-right-color 右边框颜色 border-bottom-color 底边框颜色 border-top-style border-left-styleborder-right-style border-bottom-style border-top-width border-left-widthBorder-right-width border-botto
33、m-width border 组合设置 border-top(right/left/right/bottom)属性值:Border-style:none 无边框 dotted 边框由点组成 dash 边框由短线组成 solid边框是视线 double双线Groove 立体沟槽 ridge 边框成脊形 inset 边框内嵌一个立体边框 outset边框外嵌一个立体边框(5)、方框属性:Float 让文字环绕在元素四周 clear指定在某一元素的某一边是否允许有环绕的文字和对象 clip限定只显示裁切出来的区域width设定对象的宽度height设定对象的高度padding设定边框和内容间的距离 margin 元素里浏览
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
评论
0/150
提交评论