[互联网]HTML语法.doc

1. 表单(FORM)标记(TAGS)1. 基本语法1.1表单的基本语法. . *=GET, POST1.2表单中提供给用户的输入形式*=text, password, checkbox, radio, image, hidden, submit, reset*=Symbolic Name for CGI script2. 文字输入和密码输入 *=text, password您的姓名: 您的主页的网址: 密码: 窗体顶端您的姓名: 您的主页的网址: 密码: 窗体底端3. 复选框(Checkbox) 和 单选框(RadioButton)3.1 Checkbox Banana Apple Orange变量的名字是不同的3.2 RadioButton窗体底端 Banana Apple Orange变量的名字是相同的才能单选4. 图象坐标在下面选则一个系数后，在图象上点一下，就知道什么是图象坐标了！x2x4x6窗体顶端x2 x4 x6窗体底端5. 隐藏表单的元素Here is a hidden element. 窗体顶端Here is a hidden element.窗体底端6. 列表框(Selectable Menu)6.1基本语法 . Banana Apple Orange窗体顶端6.2 大小设置 Banana Apple Orange Peach窗体顶端6.3 设置多选窗体底端注意，是用 Ctrl 键配合鼠标实现多选。(和 MS-WINDOWS 的 File Manager 一样) Banana Apple Orange Peach窗体顶端窗体底端7 .文本区域7.1建一个文本域 . 窗体顶端窗体底端7.2 对于很长的行是否进行换行的设置(Word Wrapping) . 不换行，是缺省设置。 . “软换行”，好象 MSWORD 里的“软回车”。 窗体顶端窗体底端 . “硬换行”，好象 MSWORD 里的“硬回车”。 2. 文字布局2.1行的控制2.1.1段(Paragraph) (可以看作是空行) 你好吗？很好。你好吗？很好。2.1.2换行 你好吗？很好。你好吗？很好。2.1.3不换行 请改变您浏览器窗口的宽度， 使之小于这一行的宽度， 看看这个标记的作用！请改变您浏览器窗口的宽度，使之小于这一行的宽度，看看这个标记的作用！2.2文字的对齐(Alignment). . #=left, center, rightHelloHelloHelloHello.HelloHello2.3文字的分区(Division)显示 . Can you feel happiness without unpleasant? Please show me your smile.Can you feel happiness without unpleasant?Please show me your smile. . Can you feel happiness without unpleasant?Please show me your smile. . Can you feel happiness without unpleasant?Please show me your smile.2.4 列表2.4.1无序列表 .TodayTommorow Today Tommorow2.4.2有序列表 .TodayTommorow1 Today2 Tommorow2.4.3 定义列表(Definition lists) .TodayToday is yesterday.TomorrowTomorrow is today.TodayToday will be yesterday.TomorrowTomorrow will be today.Definition lists Compact .TodayToday will be yesterday.NextTomorrow will be today.TodayToday is yesterday.TomorrowTomorrow is today.2.5定制列表元素2.5.1 定制表中的标记 #=disk, circle, squareONETWOTHREE ONEo TWO THREE2.5.2 定制有序列表表中的序号 #=A, a, I, i, 1ONE-ONEONE-TWO1 ONE-ONE1 ONE-TWOONE-ONEONE-TWO1 ONE-ONE1 ONE-TWOONE-ONEONE-TWO1 ONE-ONE1 ONE-TWOONE-ONEONE-TWO1 ONE-ONE1 ONE-TWOONE-ONEONE-TWO1 ONE-ONE1 ONE-TWO2.5.3 定制有序列表表中的序号的起始值 #=numberONE-ONEONE-TWO TWO-ONE TWO-TWO2 ONE-ONE3 ONE-TWO3 TWO-ONE1 TWO-TWO2.6 预格式化文本(Preformatted Text)2.6.1 .Please use your card.VISA MasterHere is an order form.FaxAir MailPlease use your cardVISA MasterHere is an order form. Fax Air Mail2.6.2 .Please use your card.VISA MasterHere is an order form.FaxAir MailPlease use your card.VISA MasterHere is order form. Fax Air Mail2.6.3 .Please use your card.VISA MasterHere is an order form.FaxAir MailPlease use your card.VISA MasterHere is order form.FaxAir Mail和的效果基本上是差不多的会按代码的编写的格式输出里面的所有的内容2.7空白(Spacer) #=水平空白宽度 #=竖直空白高度YESTERDAY TODAY TOMORROWYESTERDAY TODAY TOMORROW#=空白的尺寸#=top, middle, bottom, left, rightYESTERDAY TODAY TOMORROWYESTERDAYTODAYTOMORROW2.8多列文本 . #=列的数目 text text text. 例子 . #=列间的空白 text text text. 例子 . #=列的宽度 text text text. 例子2.9其它块引用(Blockquote) .Her Song:When I was young, I listened to the radio waiting for my favorite songs.Her Song:When I was young, I listened to the radio waiting for my favorite songs.闪烁 . 闪烁！闪烁！ 闪烁！闪烁！3. 表格(TABLE)标记(TAGS)3.1 表格的基本语法. - 定义表格 - 定义表行 - 定义表头 - 定义表元(表格的具体数据)3.1.1带边框的表格：FoodDrinkSweetABC FoodDrinkSweetABC3.1.2 不带边框的表格： FoodDrinkSweetABC FoodDrinkSweetABC3.1.3 跨多行、多列的表元(Table Span)跨多列的表元 Morning MenuFood Drink SweetABCMorning MenuFoodDrinkSweetABC跨多行的表元 Morning Menu Food ADrink BSweet CMorning MenuFoodADrinkBSweetC3.2 表格尺寸设置3.2.1边框尺寸设置：FoodDrinkSweetABC FoodDrinkSweetABC3.2.2 表格尺寸设置：FoodDrinkSweetABC FoodDrinkSweetABC3.2.3 表元间隙设置：FoodDrinkSweetABC FoodDrinkSweetABC3.2.4 表元内部空白设置：FoodDrinkSweetABC FoodDrinkSweetABC3.3 表格内文字的对齐/布局3.3.1 水平对齐 #=left, center, right FoodDrinkSweet A B C FoodDrinkSweetABC3.3.2 竖直对齐 #=top, middle, bottom, baseline FoodDrink SweetOther A B C DFoodDrinkSweetOtherABCD3.4表格在页面中的对齐/布局(Floating Table)FoodDrinkSweetABCMy favorites.cookies, chocolates, and more.FoodDrinkSweetABCMy favorites.cookies, chocolates, and more. FoodDrinkSweetABCMy favorites.cookies, chocolates, and more. #=space value FoodDrinkSweetABCMy favorites.cookies, chocolates, and more.FoodDrinkSweetABCMy favorites.cookies, chocolates, and more. 3.5表格的标题 . #=left, center, rightLunchFoodDrinkSweetABC LunchFoodDrinkSweetABC . #=top, bottom valign=top is default.LunchFoodDrinkSweetABC LunchFoodDrinkSweetABC窗体底端4. 页面(PAGE)标记(TAGS)4.1 HTML 文件结构(Document Structures). , , , , HTML 文件的正文写在这里. . 4.2 语言字符集(Charsets)的信息 #=us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce,iso-2022-jp, x-sjis, x-euc-jp,euc-kr, iso-2022-kr,gb2312, gb_2312-80,x-euc-tw, x-cns11643-1, x-cns11643-2, big5可在 HTML 文件中设置 MIME 字符集信息。您在浏览主页时，最好自己在浏览器的选项菜单内选择相应的语言(language encoding)。但是如果 HTML 文件里写明了设置，浏览器就会自动设置语言选项。尤其是主页里用到了字符实体(entities)，则该主页就应该写明字符集信息。否则，您在浏览该主页时，若未正确设置语言选项，显示将可能混乱。4.3 背景色彩和文字色彩bgcolor - 背景色彩text - 非可链接文字的色彩link - 可链接文字的色彩alink - 正被点击的可链接文字的色彩vlink - 已经点击(访问)过的可链接文字的色彩#=rrggbb色彩是用 16 进制的 红绿蓝(red-green-blue, RGB) 值来表示。16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.4.4 背景图象 Non Scrolling Background 页面空白(Margin) 页面左边的空白 页面上方的空白(天头) #=margin amount4.5 链接(Link)基本语法 . 这是一个链接的例子。 点一下带下划线的文字!这是一个链接的例子。 点一下带下划线的文字!跳转到页面的另外一个地方 . . 跳转到下一个链接点下一个链接点跳转到下一个链接点下一个链接点跳转到另一个页面的某个地方 . . 跳转到另一个页面的某个地方。跳转到另一个页面的某个地方。4.6 开一个新的(浏览器)窗口 (Target Window) . 开一个新窗口!开一个新窗口!4.7 标尺线 #=left, right #=rrggbb 16 进制 RGB 数码，或者是下列预定义色彩：Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua5. 图象(IMAGE)标记(TAGS)5.1 链入图象的基本语法 #=图象的 URL #=在浏览器尚未完全读入图象时，在图象位置显示的文字。5.2 图象和文字的对齐 #=top, middle, bottom My face! My Face! My face! My Face! My face! My Face! 只有一行文字才可以放在图象的两边。（不知道翻译的对不对？) Only one text line can be flown into the both side of Image.5.3 图象在页面中的对齐/布局(Floating Image)5.3.1 My Face!It is alwayssmiling.Hahaha.My Face!It is alwayssmiling.Hahaha.5.3.2 My Face!It is alwayssmiling.Hahaha.My Face!It is alwayssmiling.Hahaha.My Face!It is alwayssmiling.Hahaha. #=valueMy Face!It is alwayssmiling.Hahaha.My Face!It is alwayssmiling.Hahaha.5.4 边框 #=value5.5 客户端图象映射图(Client Side Image Map)请在下图中用鼠标到处点一点，就会理解“客户端图象映射图”的意思了。#shape=rect coords=A,A,B,B(A,A)=Upper Left, (B,B)=Lower Rightshape=circle coords=A,A,R(A,A)=Center, R=Radiusshape=poly coords=A,A,B,B,C,C.(A,A=First Corner, (B,B)=Second Corner, . 6. 表格进阶(TABLE ADVANCED)6.1 表格的色彩6.1.1 表元的背景色彩和背景图象 #=rrggbb 16 进制 RGB 数码, 或者是下列预定义色彩名称：Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, AquaFood Drink SweetABFoodDrinkSweetAB6.1.2 表格边框的色彩 FoodDrinkSweetABC FoodDrinkSweetABC6.1.3 表格边框色彩的亮度控制 FoodDrinkSweetABC FoodDrinkSweetABC6.2 表格的分组显示(Structured Table) 6.2.1 按行分组 . - 表的题头(Header) . - 表的正文(Body) . - 表的脚注(Footer) FoodDrinkSweet ABC DEFF