table标签
W3school : <table>标签定义HTML表格。 简单的HTML表格由table元素以及一个或多个tr、th或td元素组成。 tr元素 定义表格行、 th元素 定义表头、 td元素 定义表格单元。 更复杂的HTML表格也可能包括caption、col、colgroup、thead、tfoot以及tbody元素 可选的属性 文章来源: table标签
html表格
关于vue中页面表格当设置某一列fixed冻结之后覆盖临近边框线的问题？
主要是因为设置的边框默认是被td的边框所代替了，若不是设置td的border或者是td的border与tr不一致，那么显示的结果将会把临近的tr的边框和td的边框合并，如果要显示出td的边框线，则需要利用table的另外一个属性border-cellapse：cellapse；这样子便可以不会进行样式合并则是会按照标准的HTML样式分开。 文章来源: 关于vue中页面表格当设置某一列fixed冻结之后覆盖临近边框线的问题？
JS格式化JSON串显示在表格中
JS代码如下，这里用了jq的语法： <script type="text/javascript"> $(function(){ var text = $("#show_json").html(); var result = JSON.stringify(JSON.parse(text), null, 4); $("#show_json").html("<pre>"+result+"</pre>"); }); </script> html部分代码： <table> <tr> <td>json: </td> <td><p id="show_json">{"aaa":"111", "bbb":"222", "ccc":"333"}<p></td> </tr> </table> 看下效果图：
display――table-cell属性
display的table和table-cell一般情况下用的不多，所以很少有人去关注它，但他们两个联手起来会给你惊喜！ 当两个或者两个以上标签一起使用显示在同一行时，以前常用的是float、position进行布局，在高版本的浏览器可以使用flex、grid进行布局。无意中发现使用display:table-cell也是一个很好用的自适应布局，本文就display：table-cell做学习总结。 display:table-cell指让标签元素以表格单元格的形式呈现，使元素类似于td标签。IE8+及现代版本的浏览器都支持此属性，IE6/7不支持（可用其他方法实现类似效果）。同样，display：table-cell属性也会被float，position：absolute等属性 破坏效果 ，应避免同时使用。 ֵ 描述 none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素，元素前后没有换行符。 inline-block 行内块元素。（CSS2.1 新增的值） list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 compact CSS 中有值 compact，不过由于缺乏广泛支持，已经从 CSS2.1 中删除。 marker CSS 中有值
asp.net 树形表格
<html> <head> <link href="./bootstrap.min.css" rel="stylesheet"> <script src="./jquery.js"></script> <script type="text/javascript"> var data = [ { id: 1, dept: '腾讯公司', remark: '这是总部', updeptid: 0 }, { id: 2, dept: '中国分公司', remark: '分公司', updeptid: 1 }, { id: 3, dept: '深圳分公司', remark: '这是总部', updeptid: 2 }, { id: 4, dept: '开发一部', remark: '这是总部', updeptid: 3 }, { id: 5, dept: '开发二部', remark: '这是总部', updeptid: 3 }, { id: 6, dept: '财务部', remark: '这是总部', updeptid: 3 }, { id: 7, dept: '上海分公司', remark: '这是分公司', updeptid: 2 }, { id: 8, dept: '研发部', remark: '这是总部', updeptid: 7 } ]; $(function () { $
JQuery案例一：实现表格隔行换色
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>使用JQ完成表格隔行换色</title> <script src="js/jquery.min.js"></script> <script> $(function() { $("tbody tr:odd").css("background-color","aquamarine"); $("tbody tr:even").css("background-color","bisque"); var tb = $("tbody tr"); var oldColor; for(var i=0;i<tb.length;i++) { //alert(oldColor); $("tbody tr")[i].onmouseover = function() { oldColor = this.style.backgroundColor; this.style.backgroundColor = "yellow"; } $("tbody tr")[i].onmouseout = function() { this.style.backgroundColor = oldColor; } } }); </script> </head> <body> <table id="tbl"
JavaScript表格的隔行换色开发
Html代码： <! DOCTYPE html > < html > < head > < meta charset ="UTF-8" > < title > 隔行换色 </ title > </ head > < body > < table id ="tab1" border ="1" width ="800" align ="center" > < tr style ="background-color: #999999;" align ="center" > < th > 分校ID </ th > < th > 分校地区 </ th > < th > 操作 </ th > </ tr > < tr align ="center" > < td > 1 </ td > < td > 济南分校 </ td > < td >< a href ="" > 修改 </ a > | < a href ="" > 删除 </ a ></ td > </ tr > < tr align ="center" > < td > 2 </ td > < td > 昆山分校 </ td > < td >< a href ="" > 修改 </ a > | < a href ="" > 删除 </ a ></ td > </ tr > < tr align ="center" > < td > 3
html注册表
效果图如下： 1、构思： 首先，这事一个表格结构的注册表，总体分为三部分，1.会员登录名和密码，2.姓名和联系方式，3.公司名称和主营业务；我们可以把表格分成表头，表身，表尾；用代码实现为： 先创建一个表格分成三部分： <table width="1000" align="center" cellpadding="10" cellspacing="0"><!--表格--> <thead> </thead> <tbody> </tbody> <tfoot> </tfoot> </table> 说明：<table></table>标签创建出一个大的表格，其中<table>标签的几个重要的元素，width控制表格的宽度；align控制表格的对齐方式；cellpadding控制行中文字在表格中和表格上下边框的距离，cellpadding控制单元格之间的空白。 2、在表格里面使用几个重要的标签进行表格的分解 <tr> 绘制表格的行 <th>表头单元格，用来绘制表头，显示的字会比较大一点。 <td>绘制表格的列 <input>根据不同type属性，来创建文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。 <style>创建CSS样式 3、跨行跨列 如果需要将内容横跨多个行或列，使用 colspan属性来合并行，和 rowspan 属性来合并列。 最后完整代码如下： <!DOCTYPE
认识HTML标签
1.段落标签：<p>内容</p>。 使用段落标签，段前段后会有一段空白距离，可用CSS删除或改变它。 2.标题标签：<hx>内容</hx> 。标题标签一共有6个，h1、h2、h3、h4、h5、h6，重要性依次递减。<h1>是最高等级，常被用于网站名称。 3.强调标签：<strong>内容</strong>和<em>内容</em>。 用以强调一段话中的某个关键字，在浏览器中<em>默认用斜体表示，<strong>默认用粗体表示。目前国内前端程序员更喜欢用<strong>表示。 4.为文字设置单独的样式：<span>文字</span>。 <span>标签本身并没有语义，他的作用就是设置单独的样式，并不是为了起强调作用。 5.短文本引用：<q>引用的文本内容</q>。 注意引用的文本不用加双引号，浏览器会自动对q标签添加双引号。但<q>标签的真正关键点不是它的默认样式 双引号， 而是它的 语义：引用别人的话。 6.长文本引用：<blockquote>引用文本</blockquote>。 该标签是对长文本的引用，如在文章中引入大段某知名作家的文字。浏览器对<blockquote>标签的解析是 缩进样式。 7.分行显示标签：<br>或<br/>。 8.添加空格的标签： 9.添加水平分隔线：<hr/>标签。 该标签在浏览器中的默认样式线条比较粗，颜色为灰色。 10.为网页添加地址信息：
Html+CSS完成表格
最近在学习HTML、CSS在学习表格<table>标签时，发现HTML标签本身并不能修饰好看的表格，这时候需要CSS上场了，此处为内嵌CSS，CSS代码需要写在<style type="text/css">...</style>之间，table为类选择器，满足所有与table有关的标签。没有采用CSS之前如图，可以发现很丑 [html] view plain copy > < html > < head > < title > table </ title > < style type = "text/css" > </ style > </ head > < body > < table border = "1" > < caption > 纵向表格 </ caption > <!--标题--> < tr > < td > 姓名 </ td > < td > 小丽 </ td > </ tr > < tr > < td > 电话 </ td > < td > 123 </ td > </ tr > < tr > < td > 性别 </ td > < td > Ů </ td > </ tr > < table border = "1" > < caption > 横向表格 </ caption > <!--标题--> < tr > < td > 姓名 </ td > < td