html参考手册9376825700

HTML教案简介: HTML语言（Hypertext Markup language,中文通常称为超文本置标语言，或超文本标记语言）是一种文本类，解释执行的标记语言，它是Internet上用于编写网页的主要语言。 我们浏览网站的时候，看到的是丰富影像、文字、图片，这些内容都是通过HTML语言来表现出不的。HTML文件的基本结构 HTML文件开始 HTML文件的头部开始中国太极网欢迎您！(标题标记） 文件头部结束 文件的主体开始 文件的主体内容 文件的主体结束 文件结束 其中“”是任何标记的开始和结束.元素的标记要用这对尖括号括起来，并且结束的标记是在开始的标记前加一个斜杠。另外在源代码中 不区分大小写。,HTML教案二：文字与段落文字是网页设计最基础的部分，一个标准的文字页面可以起到传达信息的作用对文字的格式化，除了应用HTML标记外，另一种方式就是CSS样式。1、标题字标记标题字标记共有6种，在HTML中，定义了六级标题，从一到六级，每级标题的字体大小依次递减。基本语法： 示范：这是一本专业详尽的HTML书籍2、标题字的对齐属性:基本语法：标题左对齐标题居中对齐标题右对齐其中Hn中的n代表从1-6示范：这是一本专业详尽的HTML书籍,HTML教案三、文字的修饰标记粗体粗体斜体斜体斜体上标下标大字号小字号下划线删除线删除线地址打字机文字等宽等宽其中地址标记用于显示E-mail、地址等文字内容，主要用于英文字体的显示中。打字机标记可以创建打字机风格的字体。等宽标记可以使用等宽的字体来显示文字内容,多用于英文,HTML教案四、字体标记：如果希望更改页面中的字体，字号和颜色，最佳的标记是标记标记的属性FACE字体SIZE字号COLOR颜色1、字体属性FACE基本语法:示范:相信明天更美好2、字号属性SIZE基体语法:语法解释:标记中的SIZE字义了字号,VALUE取值范围从17或者从-1-7示范:海内存知己,天涯若比邻.海内存知己,天涯若比邻.3、颜色属性COLOR基本语法:示范:千里之行始于足下,HTML教案五、段落标记基本语法:语法解释:可以使用成对的标记来包含段落,也可以使用单独的标记来划分段落.1、段落标记的对齐属性ALIGN基本语法：示范:这是一本专业详尽的HTML书2、换行标记:段落与段落之间是隔行换行的,文字的行间距过大,这时可以使用换行标记来完成文字的紧凑换行显示基本语法:语法解释:一个换行使用一个,多个换行可以连续使用多个标记,HTML教案3、不换行标记如果浏览器中单行文字的宽度过长,浏览器会自动将文字换行显示,如果希望强制浏览器不换行显示,可以使用这个标记基本语法:示范:这是一本专业详尽的HTML书籍,如有技术问题,请联系这是一本专业详尽的HTML书籍,如有技术问题,请联系4、在标记中强制换行标记基本语法:5、预格式化标记所谓预格式化,就是保留文字在源代码中的格式,页面中显示的和源代码中的效果完全一致.浏览器在显示其中的内容时,会完全按照其真正的文本格式来显示,如原封不对地保留文档中的空白,如空格,制表符等.基本语法:6、居中标记如果希望段落或文字居中,可以使用专门的居中标记.,HTML教案基本语法:示范:这是一本专业详尽的HTML书籍,如有技术问题,请联系这是一本专业详尽的HTML书籍,如有技术问题,请联系这是一本专业详尽的HTML书籍,如有技术问题,请联系这是一本专业详尽的术问题,请联系7、缩排标记：基本语法:六、水平线标记标记代表水平分割模式，并会在浏览器中显示一条线。语法：1、水平线宽度width语法：2、水平线高度size语法：3、水平线去阴影noshade4、水平线颜色color,HTML教案5、水平线排列align三种对齐方式（center left right)七、其他标记插入空格八、网页的主体标记body1、网页背景色bgcolor语法：2、网页背景图片background语法：3、文字颜色text语法：4、边距margin语法：,HTML教案第三章：使用图像一、图像的格式网页中图像的格式通常有3种，GIF、JPEG和PNG（是一种非破坏性的网页图像文件格式它提供了图像文件以最小方式压缩又不造成图像失真的技术。）二、插入图像标记IMGIMG元素的属性Src 图像的源文件Alt 提示文字Width,height 宽度和高度Border 边框Vspace 垂直间距Hapace 水平间距Align 排列1、图像的源文件src语法：2、图像的提示文字alt语法：3、图像的宽度和高度Width,height 语法： ,HTML教案4、图像的边框border语法： 示范：在语法中,border的单位是像素，值越大边框越宽5、图像的垂直边距vspace（图像与文字之间）语法：在语法中，vspace属性的的单位是像素6、图像的水平间距hspace（图像与文字之间）7、图像的排列align对齐属性：Bottom 图片的底部和当前行的文字底部对齐、Top 图片的顶端和当前行的文字顶端对齐Middle 图片的水平中线和当前行的文字中线对齐Left 图片左对齐Center 图片水平中线和当前行的文字中线对齐Right 图片右对齐三、图像的超链接图像的链接和文字链接是一样的，都是用标签来完成的，只要将标签放在之间就可以了,HTML教案语法：第四章：使用列表列表是一种非常有用的数据排列方式，它以列表的形式来显示数据。HTML中共有3种列表分别是无序列表、有序列表和定义列表。一、1、有序列表ol语法： 有序列表项 有序列表项 有序列表项 有序列表项 在语法中，标记标志着有序列表的开始和结束，而标记表示这是一个列表项。示范： 星期一 星期二 星期三 星期四 星期五 星期六 星期日 ,HTML教案2、有序列表的序号类型type语法： 有序列表项 有序列表项 有序列表项 有序列表项 有序列表的常见5种类型1、a、A、i、I3、有序列表的起始数值start二、无序列表语法： 星期一 星期二 星期三 星期四 星期五 星期六 星期日 1、无序列表的类型type,HTML教案Disc 黑色实心圆点Circle 空心圆环Square 正方形2、定义列表标记语法： 定义条件 定义描述 定义列表由两部分组成；定义条件和定义描述。用来指定需要解释的名词，是具解释3、菜单列表标记菜单列表主要用于设计单列的菜单列表，它在浏览器中的显示效果和无序列表是相同的语法： 列表项 ,HTML教案第五章 使用表格一、创建表格1、表格的的基本构成table、tr、tdTable是表格标记tr是行标记td单元格标记二、表格的基本属性1、表格的宽度width2、表格的高度height3、表格的对齐方式align 属性值：left、center、right三、表格的边框1、表格的边框宽度border2、表格的边框颜色bordercolor3、内框宽度cellspacing表格的内框宽度用于设置表格内部每个单元格之间的间距（值为0时边框为实线）4、表格内文字与边框间距cellpadding四、表格背景1、表格背景颜色bgcolor2、表格背景图像background,HTML教案五、表格的行属性1、高度控制height语法：2、边框色bordercolor语法：3、行背景bgcolor、background4、行文字的水平对齐方式align属性：left、center、right5、行文字的垂直对齐方式valign属性：top、middle、bottom六、单元格属性1、单元格大小width、height语法:说明：单元格的宽和高单位都是像素2、水平跨度colspan在设计表格时，有时需要两个或更多的相邻单元格组合成一个单元格语法：、垂直跨度rowspan语法：,HTML教案4、对齐方式 align、valign单元格的对齐方式设置与行的对齐方式设置方法相拟水平对齐方式：left、center、right垂直对齐方式：top、middle、bottom5、单元格的背景色bgcolor6、单元格的边框色bordercolor7、单元格的亮边框bordercolorlight单元格的亮边框就是单元格边框向光的部分8、单元格的暗边框bordercolordark9、单元格的背景图像background七、设置表格的标题caption语法:表格的标题1、表头th表格的表头是单元格的一种变体，实质上仍是一种单元格。示范： 物理 物理 物理 ,HTML教案八、表格的结构1、表格的表首标记用于定义表格最上端表首的样式，可以设置背景色、文字对齐方式、文字垂直对齐方式等语法： 、表格的表主体标记用于统一表主体的部分样式语法：3、表格的表尾标记第六章：建立链接一、超级链接的基本知识要正确的创建链接，就必须了解链接与被链接文档之间的路径。每个网页都有一个惟一的地址，称为统一资源定位符（URL）。然而，在我们网页中创建内部链接时，一般不会指定链接文档的完整URL，而是指定一个相对前文档或站点文件夹的相对路径1、绝对路径：绝对路径是包括服务器规范在内的完全路径。绝对路径不管源文件在什么位置都可以非常,HTML教案精确地找到，除非是目标文档的位置发生变化，否则不会链接失败。彩用链接路径不利于测试。不利于站点移值2、相对路径二、内部链接1、认识内部链接与自身网站页面有关的链接称为内部链接语法： 2、链接的目标窗口语法：属性值：_self在当前页面中打开链接_blank在一个全新的空白窗口中打开链接_top在顶层框架中打开链接，也是以理解为在根框架中打开链接_parent在当前框架的上一层里打开链接,HTML教案三、锚点链接1、建立锚点锚点就是指在给定名称的一个网页中的某一位置，在创建锚点链接前首先要建立锚点。语法：2、链接同一页面中的锚点建立了锚点以后，就可以创建到锚点的链接。需要用#号以锚点的名称作为href属性值.语法：四、外部链接1、链接到外部网站语法：2、链接到E-mail语法：3、下载文件语法：第七章：添加多媒体一、设置滚动效果1、滚动标记marquee使用滚动标记不仅可以移动文字，并可以在标记之间设置文字或图像的属性语法:,HTML教案2、滚动方向direction语法：属性值：up、down、left、right3、滚动方式behavior属性值：Scroll循环滚动，默认效果Slide只滚动一次就停止Alternate来回交替进行滚动4、滚动速度scrollamount滚动的速度实际上是设置每次滚动时移动的长度，以像素为单位5、滚动延迟scrolldelayScrolldelay时间间隔的单位是毫秒。如果设置的时间比较长，会产生走走停停的效果。6、滚动循环loop默认情况下滚动会不断地循环下去，如果希望滚动几次后停止，可以使用loop设置滚动次数7、滚动范围width、height8、滚动背景色bgcolor9、空白空间hspace（水平范围）、vspace（垂直范围）,HTML教案二、插入多媒体文件1、插入flash动画2、插入音频和视频文件语法：3、设置背景音乐bgsound语法：说明：背景音乐的文件可以是avi或mp3等声音文件循环次数loop语法：第八章：使用框架结构1、框架的基本概念框架是浏览器窗口中的一个区域，它可以显示与浏览器窗口的其余部分中所显示的内容无关的HTML文档2、设置框架集的属性frameset3、水平分割窗口rows,HTML教案使用表单一、表单标记form1、提交表单actionAction用于指定数据提交到哪个地址进行处理语法： 说明：表单的处理程序是表单要提交的地址，也就是表单中收集到的资料将要传递的程序地址，示范：2、表单的名称name这一属性不是表单的必要的属性，但是为了防止表单提交到后台处理程序时出现混乱，一般要给表单命名、传送方法method表单的method属性用于指定在数据提交到服务器的时候哪种HTTP提交方法。可取值为get或post.get：表单数据被传送到action属性指定的URL，然后这个新URL被传送到处理程序上。post:：表单数据被包含在表单主体中，然后被送到处理程序上。,HTML教案二、插入表单对象网页中的表单由许多不同的表单元素构成。这些表单元素包括文字字段、单选按钮、复选框、菜单和列表以及按钮1、文字字段text语法：姓名：年龄：,HTML教案2、密码域password语法：3、单选按钮radio语法:示范：男女4、复选框checkbox语法：爱好:游泳打高尔夫球看小说打麻将,HTML教案5、普通按钮button在网页中按钮也很常见，在提交页面、清除内容时常常看到。普通按钮一般情况下要配合脚本来进行表单处理。语法：Value的取值就是显示在按钮上的文字示范：6、提交按钮submit语法:说明：value同样用来设置显示