html表格

js 导出 html 中的 table 表格为 excel

泄露秘密 提交于 2019-11-29 09:38:05
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body { padding: 1em; } </style> </head> <body> <div class="box"> <div> <button type="button" id="excelBtn">导出Excel方法五</button> </div> <div id="myDiv"> <table id="tableExcel" width="100%" border="1" cellspacing="0" cellpadding="0"> <!-- caption元素可以生成表标题,其单元格列跨度为表格的列数 --> <caption>学生成绩表</caption> <tr> <!-- 可以使用rowspan和colspan来合并单元格 --> <th rowspan="2">编号</th> <th rowspan="2">学号</th> <th rowspan="2">姓名</th> <th rowspan="2">性别</th> <th rowspan="2">年龄</th> <th colspan="3">成绩</th> </tr> <tr> <th>语文</th> <th

HTML中的table表格重叠的边框去除以及合并方法

为君一笑 提交于 2019-11-29 08:56:36
table表格中的边框会重叠到一起,使用标签中的border-collapse属性就可以了 <table border-collapse="collapse" > <tr><th>内容(标题)</th><th>内容(标题)</th><th>内容(标题)</th></tr> <tr><td>内容</td><td>内容</td><td>内容</td></tr> <tr><td>内容</td><td>内容</td><td>内容</td></tr> </table> 使用border-collapse之后就能够清除掉重复的边框。 合并table表格的方法 纵向合并:colspan + 合并数目 横向合并:rowspan + 合并数目 1.纵向合并是指合并指定数目的列。 2.横向合并是指合并指定数目的行。 3.其中合并的数目是你要合并的总数目减一。 4.都是td标签中的属性。 写法: <tr><td colspan="2" rowspan="2"></td></tr> 来源: https://my.oschina.net/u/2618715/blog/3104295

html(二)

限于喜欢 提交于 2019-11-29 08:30:05
文本 h1-h6,标题标签。 p,段落 hr,折行 br,换行 样式 color,字体颜色 font-size,字体字号 background-color,背景色 图像 由img标签定义,src属性指向图片存储位置,alt属性说明档图片不能正常显示时的替代文本。 width和height属性定义图像的宽度和高度。 当图像嵌入到段落中,图像相当于段落中的一个字符,图像的宽度和高度决定本行的行高和所占宽度。 如果使用float属性,可以把图片右置或左置。 链接 由a标签定义,定义链接的点可以是一段文本或者一个图片。 href=""属性定义链接跳转的位置,target="_blank"定义被链接的文档在新窗口打开,默认是在本窗口打开。 href可以指向文档对象,也可以指向某个id属性的对象,比如href="#tips",href="a.html#tips"。 表格 table 定义表格 th 定义表格的表头 tr 定义表格的行 td 定义表格单元 caption 定义表格标题 colgroup 定义表格列的组 col 定义用于表格列的属性 thead 定义表格的页眉 tbody 定义表格的主体 tfoot 定义表格的页脚 border属性定义边框属性,默认不显示边框,值为1时显示边框。 colspan属性定义单元格所占列数,rowspan属性定义单元格所占行数,可以以此实现跨行和跨列。

HTML 基础

跟風遠走 提交于 2019-11-29 07:01:12
HTML 基础   一、HTML 的概念性知识 html是 htyper text markup lauguage 即超文本标记语言,超文本就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素,而标记语言:即标记(标签)构成的语言。   网页相当于HTML文档,由浏览器解析(就像你写.py文件用pyCharm解析一样),用来展示的,静态网页即静态的资源,如xxx.html,动态网页是html代码是由某种开发语言根据用户请求动态生成的。 什么是标签:   1、是由一对尖括号包裹的单词构成 例如:<html>*所有标签中的单词不可能以数字开头.   2、标签不区分大小写.<html> 和 <HTML>. 推荐使用小写.   3、标签分为两部分:开始标签<a> 和 </a>. 两个标签之间的部分我们叫做标签体.   4、有些标签功能比较简单.使用一个标签即可.这种标签叫做自闭和标签.例如:<br/> <hr/> <img/>   5、标签可以嵌套.但是不能交叉嵌套. 标签的属性:   1、通常是以键值对形式出现的.例如 name="haishiniu"   2、属性只能出现开始标签 或 自闭和标签中.   3、属性名字全部小写.*属性值必须使用双引号或单引号包裹 例如 name="haishiniu"   4、如果属性值和属性名完全一样.直接写属性名即可. 例如 readonly

前端基础之HTML

给你一囗甜甜゛ 提交于 2019-11-29 05:07:29
一、HTML介绍 1.Web服务本质 浏览器中敲入回车发生了几件事? 1.浏览器朝服务端发送请求 2.服务端接收请求 3.服务端返回相应的请求 4.浏览器接收响应,根据特定的规则渲染页面展示给用户看 详细过程 浏览器发请求 --> HTTP协议 --> 服务端接收请求 --> 服务端返回响应 --> 服务端把HTML文件内容发给浏览器 --> 浏览器渲染页面 2.HTTP协议 什么是HTTP协议? HTTP协议是超文本传输协议 规定了浏览器与服务端之间消息传输的数据格式 四大特性 1.基于请求响应 2.基于TCP/IP之上的作用于应用层的协议 3.无状态(服务端不保存用户的状态,也就相当于客户端访问之后没有记录) 4.无连接(请求来一次我响应一次 之后立马断开连接 两者之间就不再有任何关系了) 请求数据格式 1.请求首行(标识HTTP协议版本,当前请求方式) 2.请求头(许多k,v键值对) 3.换行符(/r /n,此处应空着) 4.请求体(携带一些敏感信息,如密码) 响应数据格式 1.响应首行 2.响应头 3.换行符(/r/n,此处应空着) 4.响应体(返回给浏览器页面的数据 通常响应体都是html页面) 响应状态码 用一串简单的数字来表示一些复杂的状态或者提示信息 1XX:服务端已经成功接收了你的数据正在处理 你可以继续提交额外的数据 2XX:服务端成功响应 你想要的数据

三十九、前端HTML

邮差的信 提交于 2019-11-29 04:53:28
HTML介绍 1.Web服务本质 import socket sk = socket.socket() sk.bind(("127.0.0.1", 8080)) sk.listen(5) while True: conn, addr = sk.accept() data = conn.recv(8096) conn.send(b"HTTP/1.1 200 OK\r\n\r\n") conn.send(b"<h1>Hello world!</h1>") conn.close() 手动服务端   浏览器发请求 --> HTTP协议 --> 服务端接收请求 --> 服务端返回响应 --> 服务端把HTML文件内容发给浏览器 --> 浏览器渲染页面 2.HTML是什么 超文本标记语言(Hypertext Markup Language, HTML)是一种用于创建网页的标记语言。 本质上是浏览器可识别的规则,我们按照规则写网页,浏览器根据规则渲染我们的网页。对于不同的浏览器,对同一个标签可能会有不同的解释。(兼容性问题) 网页文件的扩展名:.html或.htm 3.HTML不是什么   HTML是一种标记语言(markup language),它不是一种编程语言。   HTML使用标签来描述网页。 4.HTML文档结构 最基本的HTML文档: <!DOCTYPE html> <html

前端基础,加标签

此生再无相见时 提交于 2019-11-29 04:52:11
web服务的本质 在浏览器中敲回车发生了几件事情? 1 浏览器向服务端发请求 2 服务端接收请求 3 服务端返回相应的响应 4 浏览器接收响应,根据特定的规则渲染页面给用户看 HTTP协议 什么是http协议 又叫超文本传输协议 规定了浏览器与服务端之间传输数据的格式 四大特性 1 基于请求响应 2 基于tcp,ip之上的应用层协议 3 无状态(无法保存用户状态,每一次来都和上一次一样) 4 无连接(每一次请求,响应,都会断开连接) 请求数据的格式 1 请求数据格式 请求首行(标识了http的版本号,和请求方式) 请求头(一大堆的k,v键值对) 换行(/r/n) 请求体(携带的是一些敏感的信息,比如用户名,密码) 2 响应数据格式 响应首行(标识了http的版本号,和响应状态码) 响应头(一大堆的k,v键值对) 换行(/r/n) 响应体(返回的是html页面) 请求方式 1 get(向服务端要资源) 2 post(向服务端提交数据) html 1注释 1 单行注释 <!--单行注释--> 2 多行注释 <!-- 单行注释 --> head内常用标签 title 用来显示网页的标题 style 用来控制样式,内部支持写css代码 link 用来引入外部css文件 script 用来支持写js代码,也支持导入外界js文件 meta(http-equiv 与 content) 1 2 3

前端基础-HTML(2)

一世执手 提交于 2019-11-29 04:45:45
1. 什么是标签以及标签的分类: 在HTML页面中,带有“< >”符号的元素被称为HTML标签,如上节提到的 <HTML>、<head>、<body>都是HTML标签。所谓标签就是放在“< >” 标签符中表示某个功能的编码命令,也称为HTML标签或 HTML元素 1.1 双标签 ~~~html <标签名> 内容 ~~~ 该语法中“<标签名>”表示该标签的作用开始,一般称为“开始标签(start tag)”,“” 表示该标签的作用结束,一般称为“结束标签(end tag)”。和开始标签相比,结束标签只是在前面加了一个关闭符“/”。 ~~~html 比如 我是文字 ~~~ 1.2 单标签 ~~~html <标签名 /> ~~~ 单标签也称空标签,是指用一个标签符号即可完整地描述某个功能的标签。 ~~~html 比如 ~~~ 2. HTML标签关系 标签的相互关系就分为两种: 1.嵌套关系:像html中<head>与<title>的关系 2.并列关系:像html中<head>与<body>的关系 测试题: 请问下列哪个标签是错误的? A <head></head><body></body> B <strong><div></div></strong> C <head><title></head></title> D <body><div></div></body> 倡议:

HTML学习笔记一

[亡魂溺海] 提交于 2019-11-29 00:56:07
HTML 描写 HTML是网页语言(超文本标记语言),采用标签格式进行编写 HTML标签:采用尖括号包围的关键字,通常成对出现(闭合标签),但是也有个别非成对的(非闭合标签) HTML文档:一个完整的HTML编写的文档,可以形成一个浏览器可以访问的资源网页 <html> <body> <h1> </h1> <p> </p> </body> </html> 如上就是最简单的HTML文档内容,< html> 标签之间描述的代码内容就是描述网页(文档内容),< body>标签之间的文本代表可见的网页文档内容,< h1>代表一级标题,< p>代表一个内容段落 HTML标题:< h1>~< h6> 在HTML中,分为六级标题,第六级标题就是和普通文本同效力 <html> <body> <h1> 一级标题 </h1> <h2> 二级标题 </h2> <h3> 三级标题 </h3> <h4> 四级标题 </h4> <h5> 五级标题 </h5> <h6> 六级标题 </h6> </body> </html> HTML段落:< p> 一个段落标签内容,都会是一个段落内容,可以有多个段落 HTML换行:< br /> 在HTML中,可以使用该标签在文本中换行显示 HTML链接:< a> HTML文档中URL格式的连接都是利用 < a>标签进行定义的 <a href = "http://www

JQuery实现表格动态增加行并对新行添加事件

心不动则不痛 提交于 2019-11-29 00:06:13
实现功能: 通常在编辑表格时表格的行数是不确定的,如果一次增加太多行可能导致页面内容太多,反应变慢;通过此程序实现表格动态增加行,一直保持最下面有多个空白行。 效果: 一:原始页面 二:表1增加新行并绑定timepicker 三:表2自动增加行,新行绑定timepicker HTML 源码 : ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 <!DOCTYPE html> <