请登录[¤ 阳光论坛 ¤]参与讨论


阳光宝宝
90

 □ 主题: 网页编辑:HTML表格标记和表单标记的使用
 □ 内容: 1楼

      HTML表格标记和表单标记的使用 
       
      一:HTML表格标记: 
       
       
       
       
      1.表格的基本知识: 
       
       表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。 
       
       其中字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 
       
       
       
       
      2.表格的基本语法: 
       
       <table>...</table> - 定义表格 
       
       <tr> - 定义表行 
       
       <th> - 定义表头 
       
       <td> - 定义表元(表格的具体数据) 
       
       
       
       
      3.表格的边框: 
       
       带边框的表格: <table border=#> ... </table> 
       
       不带边框的表格: <table> ... </table> 
       
       
       
       
      4.跨多行,多列的表元: 
       
       跨多行的表元(成为表头): <th rowspan=#>...</th> 
       
       跨多列的表元(成为表头): <th colspan=#>...</th> 
       
       
       
       
      5.表格尺寸设置: 
       
       边框尺寸设置: <table border=#> ... </table>  
       
       表格尺寸设置: <table width=# height=#> ... </table> 
       
       表元间隙设置: <table cellspacing=#> ... </table> 
       
       表元内部空白设置: <table cellpadding=#> ... </table>  
       
       
       
       
      6.表格内文字的对齐和布局设置: 
       
       
       <tr align=#> 设置一行的文字对齐方式 
       
       
       <th align=#> #=left, center, right 设置表头的文字对齐方式  
       
       
       <td align=#> 设置表元的文字对齐方式 
       
       
        
       
       
      7.表格在页面内的对齐和布局: 
       
       
       <table align=left> 
       
       
       <table vspace=# hspace=#> #=space value 设置边距大小.. 
       
       
        
       
       
      8.表格的标题: 
       
       
       <caption align=center>标题</caption>
——
      
争分夺秒背单词 → yearly  a.每年的 ad.一年一度
 □ 发帖时间:2013-5-13|15:09:09 |回复|返回|



阳光宝宝
90

 □ 主题: 回应:网页编辑:HTML表格标记和表单标记的使用
 □ 内容: 2楼

      9.综合案例: 
       
       
      [html] view plaincopyprint? 
      01.<html>  
      02.  
      03. <head>  
      04. <title>网页的表格元素的使用示例</title>  
      05. </head>  
      06.  
      07. <boby>  
      08. <basefont size=5> <!--设定网页的字体的大小1~7-->  
      09.  
      10. <table border=1 align=center bordercolor=#E674FA cellspacing=0 width=400px heigth=480px>  
      11.  
      12. <tr> <th colspan=3 align=center> 星期一菜谱 </th> </tr>  
      13. <tr> <th rowspan=2 align=center> 素菜 </th> <td align=center> 青菜茄子 </td> <td align=center> 花椒土豆 </td> </tr>  
      14. <tr> <td align=center> 小葱豆腐 </td> <td align=center> 炒白菜 </td> </tr>  
      15. <tr> <th rowspan=2 align=center> 荤菜 </th> <td align=center> 鱼香肉丝 </td> <td align=center> 油闷大虾 </td> </tr>  
      16. <tr> <td align=center> <img src="Hydrangeas.jpg" width=100px border=1> </img> </td> <td align=center> 龙肝凤蛋 </td> </tr>  
      17.  
      18. </table>  
      19. </boby>  
      20.</html>  
      
——
      
争分夺秒背单词 → even  a.同一日期的
 □ 发帖时间:2013-5-13|15:09:46 |回复|返回|



阳光宝宝
90

 □ 主题: 回应:网页编辑:HTML表格标记和表单标记的使用
 □ 内容: 3楼

      二:HTML表单标记: 
       
      1.HTML表单标记的基本概念: 
       
       表单是一个包含表单元素的区域。 
       
       表单用于搜集不同类型的用户输入向服务器传输数据。 
       
       表单使用表单标签(<form>)定义。<form> ... </form> 
       
       必需的 action 属性:规定当提交表单时,向何处发送表单数据。<form action="#"> 
       action="#" 表单的提交对象的URL 
       可选的method 属性:规定如何发送表单数据.<formmethod="#"> 提交方法有get和post两种  
       
       
       
       
      2.表单元素的种类? 
       
       表单元素是允许用户在表单中输入信息的元素,比如:文本域、下拉列表、单选框、复选框等等。 
       
       
       
       
       
      3.输入标签(<input>): 
       
       输入类型是由类型属性(type)定义的.输入字段可以是文本字段(type="text")、 
       按钮(type="button"),复选框(type="checkbox")、单选按钮(type="radio")、 
       掩码后的文本控件(type="hidden")、文件选择(type="file")等等。例如: 
       
       
      •文本字段(type="text") 
       
       用户名:<input type="text" name="username" size=50 maxlength=40 /> 
       
       
      •密码域(type="password") 
       
       密 码:<input type="password" name="password" /> 
       
       
      •提交(type="submit")和重置(type="reset") 
       
       <input type="submit" vaule="发送" /> 
       
       <input type="reset" vaule="重新填写" /> 
       
       
       
      •按钮(type="button") 
       
       <input type="button" value="Hello world!"> 
       
       
      •复选按钮(type="checkbox") 
       
       <input type="checkbox" name="v1"/>西瓜 <br /> 
       <input type="checkbox" name="v1"/>西红柿  
       
       
      •单选按钮(type="radio") 
       
       <input type="radio" name="sex"/>男 <br /> 
       <input type="radio" name="sex"/>女 
       
       
      •掩码后的文本控件(type="hidden") 
       
       <input type="hidden" value="123" name="hidden"/>  
       
       
      •文件选择(type="file") 
       
       请选择文件: <input type="file" name="myfile"/> 
       
       
       
       
      4.选择列表标签(<select>): 
       
       select 元素可创建单选或多选菜单。 
       
       可选的属性: 
       <select multiple="multiple" size="2">  
       multiple 属性规定可同时选择多个选项。 
       size 属性规定下拉列表中可见选项的数目。 
       disabled 属性规定禁用下拉列表。被禁用的下拉列表既不可用,也不可点击。 
       name 属性规定 select 元素的名称。 
       
        
       
      5.HTML <option> 标签 
       option 元素定义下拉列表中的一个选项(一个条目)。必须配合select 元素使用. 
       在 HTML 中,<option> 没有结束标签。在 XHTML 中,<option> 必须被正确关闭。  
       可选的属性:  
       selected 属性规定在页面加载时预先选定该选项。 
       value 属性规定在表单被提交时被发送到服务器的值(如果没有指定 value 属性,选项的值将设置为 <option> 标签中的内容)。 
       
       
       
       选择列表示例: 
       你的出生地: 
       <select name="birthday"> 
       <option value="">--- 请选择 ---</option> 
       <option value="beijing"> 北京 </option> 
       <option value="shanghai"> 上海 </option> 
       <option value="tianjing"> 天津 </option> 
       <option value="chongqing"> 重庆 </option> 
       </select> 
      
——
      
争分夺秒背单词 → forty  num.四十,第四十
 □ 发帖时间:2013-5-13|15:10:32 |回复|返回|

 页次:1/1页 每页10  本主题贴数2 分页: 1


你还没有登录论坛,所以不能发表你的意见。你可以选择:

1、我已注册,我要

2、我还没注册,我要

3、太麻烦了,我还是

Go Top

Copyright by(C)2003-2015 http://abc.sy578.cn