网站开发网站建设,常州建站程序,宜昌网站设计制作公司,怎么在阿里云服务器上建设网站#x1f525;博客主页#xff1a; 【小扳_-CSDN博客】 ❤感谢大家点赞#x1f44d;收藏⭐评论✍ 文章目录 1.0 表格标签概述 1.1 表格标签定义 2.0 表单标签概述 2.1 表单标签定义 3.0 表单项标签概述 3.1 表单项标签定义 1.0 表格标签概述 顾名思义#xff0c;就是用来… 博客主页 【小扳_-CSDN博客】 ❤感谢大家点赞收藏⭐评论✍ 文章目录 1.0 表格标签概述 1.1 表格标签定义 2.0 表单标签概述 2.1 表单标签定义 3.0 表单项标签概述 3.1 表单项标签定义 1.0 表格标签概述 顾名思义就是用来定义表格用的标签。在网页中以表格(行、列)形式整齐展示数据如班级表。 1.1 表格标签定义 table定义表格整体可以包裹多个 tr border规定表格边框的宽度(如果没有这个属性整体表格是不会显示边框) width规定表格的宽度(整体表格的宽度) cellspacing规定单元之间的空间(如果没有这个属性默认单元之间是有空隙的) tr表格的行可以包裹多个 td td表格单元格(普通)可以包裹内容,如果是表头单元格可以替换为 th 具有加粗居中的效果
代码如下 !DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodytable border1px cellspacing0px width300pxtrth学号/thth姓名/thth性别/thth专业/th/trtrtd01/tdtd张三/tdtd男/tdtd计科/td/trtrtd02/tdtd李四/tdtd男/tdtd美术/td/trtrtd03/tdtd王五/tdtd女/tdtd体育/td/tr/table
/body
/html 运行结果为 需要注意的是若表格中的属性没有 border 时整体表格都不会有边框如 若表格中的属性没有 cellspacing 时单元表之间默认是有间隙的如 2.0 表单标签概述 表单标签可能我们每天都会接触到比如账号密码的登录。在网页中主要负责数据采集功能。
表单的结构形式 2.1 表单标签定义 form定义表单的整体 action规定当提交表单时向何处发送表单数据URL 。如果不指定默认提交到当前页面。 method规定用于发送表单数据的方式GET、POST get在 url 后面拼接表单数据url 长度有限制默认值。 post在消息体(请求体)中传递的参数大小无限制。
代码如下 form action methodget表单项1表单项2.../form 3.0 表单项标签概述 表单项是组成表单的基本元素
表单项的结构 比如性别这项是由表单项定义而来。 3.1 表单项标签定义 input表单项通过 type 属性控制输入形式 type 属性 select定义下拉列表option 定义列表项 textarea文本域cols指定一行多少个字符rows指定一共多少行。 代码如下 !DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyform action methodpost姓名: input typetext nameusernamebrbr密码: input typepassword namepassbrbr性别: labelinput typeradio namegender value1男/labellabelinput typeradio namegender value2女/labelbrbr爱好: labelinput typecheckbox namehobby valuejavajava/labellabelinput typecheckbox namehobby valuegamegame/labellabelinput typecheckbox namehobby valuesingsing/labelbrbr图像: input typefile nameimagbrbr生日: input typedate namebirthdaybrbr时间: input typetime nametbrbr日期时间: input typedatetime-local namelocaltimebrbr邮箱: input typeemail nameemailbrbr年龄: input typenumber nameagebrbr学历: select namegenderoption value0--------请选择--------/optionoption value1--------高中--------/optionbroption value2--------初中--------/optionbroption value3--------小学--------/optionbr/selectbrbr描述: textarea namedis cols30 rows10/textareabrbrinput typebutton value按钮input typereset value重置input typesubmit value提交/form
/body
/html 运行结果为 填完数据之后查看数据提交的位置
所填写的数据 由于 method post 那么数据会在消息体中
