html5表格代码,html 表格代码

求html5代码

这个是基础的表格，你可以去研究改一下就可以了。

!DOCTYPE html

html lang="en"

head

meta charset="UTF-8"

meta name="viewport" content="width=device-width, initial-scale=1.0"

title表格/title

/head

body

table border="2" cellpadding="12"

tr

td colspan="3"商品类目/td

/tr

tr

td rowspan="3"虚拟/td

td移动/td

td联通/td

/tr

tr

td充值卡/td

td彩票/td

/tr

tr

td梦幻/td

tdQQ/td

/tr

tr

td rowspan="3"护肤/td

td美容护肤/td

td美体/td

/tr

tr

td彩妆/td

td香水/td

/tr

tr

td个人护理/td

td保健/td

/tr

/table

/body

/html

相关问答

Q1: thml如何制作表格代码？

首先打开软件，新建一个HTML5文档。为文档命名为：table。当然新建文档的方法有很多，使用的软件不同，方式不同。

在body/body之间输入以下代码:

table thead tr th标题1/th th标题2/th th标题3/th /tr /thead tbody tr td单元格1/td td单元格2/td td单元格3/td /tr

... ... /tbody/table/body

我们可以看到表格已经完成大半，除了线框尚未加上以外。这时，我们只用在标签table里加一个属性border="1"

这时候我们再在浏览器中查看，会发现表格的边框就已经加上了。

万变不离其宗，在最基本的代码基础上再加其他代码便可制作出绚丽的表格了。

Q2: HTML5网页前端设计中如下图表单的代码怎么写？

下面是表单代码，你直接再加属性就可以了，表单用 table 写比较简单，div 太麻烦了；

html xmlns=" "

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

title黑板/title

/head

body

div style="width:500px;"

h1 style="width:500px;height:50px;color:#2A8DF0;border-bottom:#2A8DF0 solid 3px; text-align:center;"用户注册页面/h1

table cellpadding="0" cellspacing="10" style="margin:0 auto;"

tr

td align="right" valign="top"div用户名：/div/td

tdinput style='width:250px' value='请输入用户名' //td

/tr

tr

td align="right" valign="top"div密 码：/div/td

tdinput style='width:250px' value='请输入密码' //td

/tr

tr

td align="right" valign="top"div确 认：/div/td

tdinput style='width:250px' value='请再次输入密码' //td

/tr

tr

td align="right" valign="top"div姓 名：/div/td

tdinput style='width:250px' value='请输入真实姓名' //td

/tr

tr

td align="right" valign="top"div邮 箱：/div/td

tdinput style='width:250px' value='请输入电子邮箱' //td

/tr

/table

div align="center"input style="width:100px;height:30px;text-align:center;line-height:30px;background:#2289F0;border:#2289F0;color:white;font-weight:bold;font-size:16px;" type="submit" value="提交注册" //div

/div

/body

/html

Q3: HTML5-表格

HTML ul 元素 ( 或 HTML 无序列表元素） 代表多项的无序列表，即无数值排序项的集合，且它们在列表中的顺序是没有意义的。通常情况下，无序列表项的头部可以是几种形式，如一个点，一个圆形或方形。头部的风格并不是在页面的 HTML 描述定义, 但在其相关的 CSS 可以用 list-style-type 属性。 ul 标签需要和 li 标签结合使用。

属性说明：

HTML ol 元素 表示多个有序列表项，通常渲染为有带编号的列表。

属性说明:

HTML 元素 （或 HTML 描述列表元素）是一个包含术语定义以及描述的列表，通常用于展示词汇表或者元数据 ( 键-值对列表 )。

HTML 的 table 元素表示表格数据 — 即通过二维数据表表示的信息。

? 属性：(写在开头标签的里面的单词就叫做该元素的属性)

浏览器运行效果如下：

把上面表格中数字为 1 和 2 的单元格进行合并，数字为 3 和 6 的单元格进行合并。

数字为 1 和 2 的单元格分别在不同的列中所以是进行了列合并，因为只需要合并两个单元格所以 colspan 的值为 2， 列合并只需要在数字为 1 的单元格中添加属性 colspan，然后把数字为 2 的单元格删除，列合并就完成了。

数字为 1 和 2 的单元格分别在不同的行中所以是进行了行合并，因为只需要合并两个单元格所以 rowspan 的值为 2， 行合并只需要在数字为 3 的单元格中添加属性 rowspan，然后把数字为 6 的单元格删除，行合并就完成了。

浏览器运行效果如下：

Q4: 求html5代码，编写一个form表单，实现一个学生信息输入

!DOCTYPE html

html

head

  meta name="viewport" content="width=device-width, initial-scale=1.0"

  style type="text/css"

  input[type='radio'],

  input[type='checkbox'],

  label {

    cursor: pointer;

  }

  /style

/head

body

  form action="地址" methed="post"

    学号：

    input type="text" name="user" placeholder="请输入用户名" /

    br /

    密码：input type="text" name="pwd" placeholder="请输入密码" password="键盘" /

    br /

    性别：

    input type="radio" name="sex" id="sex1" value="男" checkedlabel for="sex1"男/label /

    input type="radio" name="sex" id="sex2" value="女"label for="sex2"女/label /

    br /

    电话：input type="text" name="phone" placeholder="请输入电话号码" /

    br /

    邮箱：input type="text" name="email" placeholder="请输入注册邮箱" /

    br /

    出生年月：input type="text" name="birth" /

    br /

    爱好：

    input type="checkbox" name="like" id="like1" value="篮球"label for="like1"篮球/label /

    input type="checkbox" name="like" id="like2" value="足球"label for="like2"足球/label /

    input type="checkbox" name="like" id="like3" value="羽毛球"label for="like3"羽毛球/label /

    br /

    input type="submit" value="提交" /

    input type="reset" value="重置" /

  /form

/body

/html

Q5: 用HTML5和CSS3怎么写出两行四列排版？

代码如下：

!DOCTYPE html

html

head

meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"

title用html+CSS做表格/title

style type="text/css"

ul{padding:0;

width:324px; /*设置表格宽 */

height:42px; /*设置表格高*/

margin:30px;

border-top:#000 1px solid; /*设置表格上边框*/

border-right:#000 1px solid; /*设置表格右边框*/

}

li{ border-left:#000 1px solid; /*设置表格左边框*/

border-bottom:#000 1px solid;/*设置表格下边框*/

/*设置单元格边框*/

list-style:none; /*清除项目列表前的标记*/

float:left; /*设置单元格浮动，用于水平排列*/

display:block; /*设置单元格为块级元素于用语控制大小等*/

width:80px; /*设置单元格宽*/

height:20px; /*设置单元格高*/

text-align:center; /*设置单元格内文本对齐方式*/

}

/style

/head

body

!-- 原理就是利用项目列表的每个项目做出表格中的每个单元格，然后通过设置ul和li的边框达到设置表格的边框效果 --

ul

li表格1/li

li表格2/li

li表格3/li

li表格4/li

li表格A/li

li表格B/li

li表格C/li

li表格D/li

/ul

/body

/html

----希望对你有帮助 ----

-------满意采纳奥-----