<特殊字元> 因为在HTML中可能有些字元很难显示，譬如说我们想在网页中显示<font>的字样，font 一定可以显示，但<跟>符号会被认为是标签符号，结果就是整个内容被视为无效标签。 如果要输入这些特殊的符号，可以在html中写入这些代替： &lt; "<"小於 &rt; ">"大於 &amp; "&"&符号 &nbsp; " "空格 &quot; """双引号 <表格> <table></table>表格 这个标签可以宣告要制造一个表格，但单有这个标签没有用处，它只负责表示表格这个 整体，是用来增加表格属性的。如果要制造表格的内容，我们需要几个子标签： <tr></tr>列 <td></td>行 <th></th>标题行 表格的制作比较类似这样的形式： □→□→□→□... ↓ □→□→□→□... ↓ □→□→□→□... ... 每列为一单位(就是一个<tr>标签)，每列又以<td>作为一行。所以，假设我们要制作宽为 1，高为2的表格(之後简称1x2)，就是这样子写： <table> <tr> <!--第一列开始，还有我是注解--> <td>hello</td> <!--第一列第一行--> </tr> <tr> <!--第二列开始--> <td>hello</td> <!--第二列第一行--> </tr> </table> 这样就会产生如下的表格了 □ □ 又如果我们要制造3x3，就以此类推继续写： <table> <tr> <td>aaa</td> <td>bbb</td> <td>ccc</td> </tr> <tr> <td>aaa</td> <td>bbb</td> <td>ccc</td> </tr> <tr> <td>aaa</td> <td>bbb</td> <td>ccc</td> </tr> </table> 那<th>标签呢？用法跟<td>完全一样，但是其中的文字会是粗体置中，通常用来制作表 格的起头。大部分情况，可以跟合并标签一起使用(待会再说)。 注意可能目前你所制造出来的表格没有框线，这是正常的，因为框线必须透过指定一些属 性来制作。通常大部分的属性，<table>标签所用的属性<td>也大多能用。 <table>属性： align:对齐方式 background:背景图片，值是图片的路径 bgcolor:背景颜色 border:表格外框粗细 bordercolor:表格框线颜色 bordercolordark:表格框线暗面颜色 bordercolorlight:表格框线亮面颜色 cellpadding:表格框线与内容间的空白量，允许使用数字(像素)或百分比为值 cellspacing:设定格与格间的空白量，也允许使用数字或百分比为值 class:CSS的类别选取器定义样式用 dir:文字方向 height width:表格的宽高 id:元素名称 style:CSS的样式定义规则 summary:表格的简短注解(不会显示) title:滑鼠移到表格时的注解文字 其中表格还有很多的设定可以透过style的CSS设定来达成。 <td>属性(只列出td独有的属性，当然，th也共用)： colspan:水平合并表格，决定此格会占据几栏的位置。 rowspan:垂直合并表格，决定此格占据几列的位置。 valign:指定垂直对齐方式，可用值有三种： top:置顶对齐 middle:置中对齐(预设值) bottom:置底对齐 所以，如果今天想要建造一个2x2的表格，但是第一列的那格横跨两格，可以这样： <table> <tr> <td colspan=2>this is title</td> </tr> <tr> <td>aaa</td> <td>bbb</td> </tr> </table> 又如果想要把2x2表格的第一行全部合并，则： <table> <tr> <td rowspan=2>this<br>is<br>title</td> <td>aaa</td> </tr> <tr> <td>bbb</td> </tr> </table> 此时第二列的<tr>标签中就必须少一个<td>。 来个复杂一点的好了，假设想要制作这样的表格： ┌─┬─┬─┬─┐ │CE│／│＊│－│ ├─┼─┼─┼─┤ │１│２│３│　│ ├─┼─┼─┤＋│ │４│５│６│　│ ├─┼─┼─┼─┤ │７│８│９│　│ ├─┴─┼─┤＝│ │　０　│。│　│ └───┴─┴─┘ 就变成这样做了： <table> <tr> <td>CE</td> <td>/</td> <td>*</td> <td>-</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td rowspan=2>+</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> <td rowspan=2>=</td> </tr> <tr> <td colspan=2>0</td> <td>.</td> </tr> </table> 表格大约就讲解到这样...其实如果有志想把作业作成像讨论区那种表格的人可以练习 练习。 <表单> 表单简单说就是一份由Client客户端来填写的东西，填写的内容可以透过javascript或 php等语言做处理，这些语言这里不讨论，这里只讨论一些表单的标签而已。 <form></form>表单 宣告一份表单，跟表格一样，这个标签没有任何作用，只会宣告一些表单整体的属性。 所有表单的元素标签如下： <input>输入资料 虽说是输入资料用，<input>标签透过给定属性之後，几乎可以给定所有的表单元件。 这个标签同时是单独使用。 <input>属性： type:指定input标签的元件型态，值有以下这些： button:制造按钮 checkbox:核取方块 file:文字栏位附加一个"浏览"的按钮 hidden:制造一个看不见的栏位 image:产生一张图片，使用者按下图片後送出表单资料 password:产生密码栏位，输入的资料以密码型态显示 radio:单选式方块 reset:制造"重设"按钮 submit:制造"送出"按钮 text:产生文字栏位 其他属性可能对某些元件有效，有些则无效，分述如下： align:对齐方式 →image alt:滑鼠的注解文字 →image autocomplete:值是布林值，将文字与密码的栏位自动输入，使用者就不需再重新输入 一次。 →text,password checked:预设核取，该元件开始就会是选取的状态，没有指定值。 →button,checkbox class:CSS类别选取器定义样式用 →全部 disabled:设定是否启用这个元件，值是布林值 →全部，不包含hidden hspace vspace:设定元件左右/上下空白量 →button,image id:元素名称 →全部 maxlength:设定文字栏位最长的输入字元数 →text,password name:元件的名称，会是送出标单时的名称，值是任意文字 →全部 readonly:不能更改文字栏位的内容，值是布林值 →text,password size:元件的宽度，单位是字元 →全部，不包含hidden src:图片档的路径 →image style:CSS样式定义规则 →全部 title:滑鼠移到元件的注解文字 →全部，不包含hidden width:元素的宽度 →全部，不包含hidden <select></select>下拉选单 建立一个下拉选单，只有这个标签并不会有效果，必须配合子标签<option></option> 使用。 语法是这样的： <select> <option value="1">第一项</option> <option value="2">第二项</option> <option value="3">第三项</option> </select> 其中每一个选项是以option标签来定义，option的属性value则决定当表单回传时，这个 选单的回传值。 另外，如果要把option的选项分组，可以使用<optgroup></optgroup>。 <select> <optgroup>第一组 <option>1-1</option> <option>1-2</option> </optgroup> <optgroup>第二组 <option>2-1</option> <option>2-2</option> </optgroup> </select> <select>属性： align:对齐方式 class:CSS类别选取器定义样式用 id:元素名称 multiple:改为"多选式选单"，没有指定值 name:元件名称，回传的时候必备 size:选单显示数，如果数字小於选项数目，就会是下拉选单，预设值为1 style:CSS样式定义规则 title:注解 <option>属性： class:CSS类别选取器定义样式用 dir:文字方向 selected:预设的选项，没有指定值 value:该选项的值，会是选单的回传值 <textarea></textarea>文字方块 制作一个可输入多行文字的方块。放在标签内的文字会变成文字方块内的预设文字。 <textarea>属性： class:CSS类别选取器定义样式用 cols:文字方块最多的一行容纳字元数(简单说就是宽度)，超过这个数字的输入会断行 rows:文字方块最多容纳几行，就是指高度 contenteditable:设定文字方块的内容是否可更改，值是布林值 disabled:设定文字方块启用与否，没有指定值 id:元素名称 name:元件名称，回传值时必备 readonly:设定元素内容为唯读，没有指定值 style:CSS样式定义规则 title:注解 wrap:决定文字方块中的分行方式，可用值有三种： soft:超过文字方块宽度(cols)时自动断行(预设值) hard:会断行，传回时会产生断行字元 off:不断行 <fieldset></fieldset>表单区块 绘制一个矩形把内容的表单集结起来。 今天暂且写到这...应该再一篇就可以讲完html了。 写钢弹去囧 --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 59.121.11.252 ※ 编辑: joehuang92 来自: 59.121.11.252 (12/26 11:47)