table相关知识
-
jquery对table的操作table的获取:table = document.getElementById("table");table tr的添加:var row = table.insertRow((index+1));if (index%2 == 0) {row.className = "even";}else {row.className = "odd";}var col = row.insertCell(0);col.innerHTML = '<span>'+(index+1)+'</span>';...table的删除$("#table tr").empty()第一行不删除$("#table tr:not(:first)").empty()获取table选中的行给每行添加checkbox,获取选中行的个数:$('input[name="box&quo
-
ng-table后台分页HTML:<table ng-table="$ctrl.tableParams" class="table table-60 border-bottom table-vms table-hover table-condensed table-scroll" ng-form="$ctrl.tableForm"> <tbody> <tr ng-repeat="row in $data" ng-form="rowForm" ng-class="{'bg-gray-vms':row.active === 0}&
-
HTML标签之table对于table来说,在一些小的模块中进行表格布局是非常好用的。我们可以这样来理解table,主要分成table部分和td部分。table部分:主要是来控制外边框的(就是最外面一层边框,不包括里面部分),它拥有的属性为:margin属性,border属性,cellspacing属性,规定单元格之间的空白cellpadding属性,规定单元边沿与其内容之间的空白。tr部分:主要来分割有几行,一般只需要用来设定heigth。td部分:用来控制每个单元格的属性,可是分别控制每个单元格的上下左右边框,其中也包含padding属性。th部分:用法和td相同,只是用来区分表头的。注意:用百分比和用像素点是相同的。在table中,width指的是整个表格的宽度,而td的width值得指内部不包括内容content的宽度,这个同盒子模型。以下用实例来说明table的一些常用布局手法: <table bordercolor="red" border="1
-
MySQL CREATE TABLE 语句详解Summary: in this tutorial, we will show you how to create new tables in a particular database using MySQL CREATE TABLE statement.MySQL CREATE TABLE syntaxIn order to create a new table within a database, you use the MySQL CREATE TABLE statement. The CREATE TABLE statement is one of the most complex statement in MySQL.The following illustrates the syntax of the CREATE TABLE statement in the simple form:CREATE&nbs
table相关课程
table相关教程
- 2.1 alter table 下面语句将表 t1 的存储引擎修改为 InnoDB:mysql> create table t1( -> c1 int not null, -> c2 varchar(10) default null -> ) engine = myisam;Query OK, 0 rows affected (0.06 sec)mysql> alter table t1 engine = innodb;Query OK, 0 rows affected (0.07 sec)Records: 0 Duplicates: 0 Warnings: 0mysql> show create table t1\G;*************************** 1. row *************************** Table: t1Create Table: CREATE TABLE `t1` ( `c1` int(11) NOT NULL, `c2` varchar(10) DEFAULT NULL) ENGINE=InnoDB DEFAULT CHARSET=utf81 row in set (0.00 sec)alter table 的操作需要执行比较长的时间,它是将原表复制到一张新的表中,同时原表加上读锁,复制期间会耗费大量的 IO,所以一般在应用空闲时,才可进行 alter table 操作。
- 2.1 table 标签 table 用于声明一个表格,它本身不显示任何内容,例如:<table border="1"></table>977代码解释:上述定义了一个只有边框而没有内容的表格,由于没有任何内容,它在网页中只显示一个像素点。2.1.1 bgcolor 属性这个属性可以应用于表格的任意元素,用来定义元素的背景颜色,其内容可以用 rgb 值表示。实际项目中通常用于在表头设置背景,为了方便和单元格区分开来,例如:978代码解释:上述代码将表头单元格设置为灰色背景。HTML 中颜色值可以使用 3 种表示方式:RGB;16 进制;英文代码(部分颜色可用)例如:<table bgcolor="#FF0000"></table><!--16进制表示法表示“纯红色”--><table bgcolor="rgb(255,0,0)"></table><!--RGB表示法表示“纯红色”--><table bgcolor="Red"></table><!--英文法表示“纯红色”-->979注意,在实际项目中,这个属性建议使用 css 的方式替代。2.1.2 align 属性定义表格元素的对齐方式,一般建议使用 css 替代,可选项有 left、center、right,例如:980代码解释:上述代码中,将左边列设置为居中对齐。表格中的表头 th 元素默认是居中对齐,而单元格元素默认是靠左对齐(跟浏览器相关),所以实际项目中一般会将类别列设置为居中对齐,实际项目建议使用 css 的方式替代。2.1.3 border 属性表格默认是没有边框的,通过这个属性可以给表格设置边框,但是一般情况下使用 css 设置边框样式比较常见。981代码解释:如果给 table 元素设置 border 属性,表格内部的单元格都会继承这个属性,但是如果 border 设置值超过 1 的话,单元格的边框还是只有 1,但是表格外部边框会显示 border 值对应的宽度;如果 border 设置 0 的话表示隐藏边框。2.1.4 cellpadding 属性通过这个属性可以设置单元格内容到边沿之间的空隙,这个值设置的越大则单元格越大,不设置的话默认是 2 个像素。如下,我们设置一个较大空隙的单元格:982注意: 请勿将该属性与下面的 cellspacing 相混淆。2.1.5 cellspacing 属性与上个属性不同的是,cellspacing 指的是单元格与表格外边框之间的空隙,如果不设置的话默认是 2 个像素,设置为 0 表示没有空隙,例如:9832.1.6 frame 属性定义外侧哪个边框是可见的,实际项目中很少用到。2.1.7 rules 属性定义内侧边框哪个是可见的,实际项目中很少用到。2.1.8 summary 属性定义表格摘要。这个属性对表格的外观没有任何作用,相当于对表格做了一个备注,可能对搜索引擎有帮助,例如:984
- 认识表格标签 table 标签 表格在我们的网页中是非常常见的,比如我们要展示商品信息,工作安排,产品参数等都需要用到表格。那么在 html 中,使用表格就需要用到 table 标签了。但是表格不仅是 table 一个标签,需要用到和表格相关的一组标签,这一小节我们就来学习这些标签吧。
- 7. 编写列表页面(views/list.vue) <template> <div> <el-table class="el-table" :data="todoList" border style="width: 100%" :row-class-name="tableRowClassName" > <el-table-column fixed prop="name" label="事项名称" width="150"> </el-table-column> <el-table-column prop="date" label="事项截止时间" width="120"> </el-table-column> <el-table-column prop="type" label="事项类型" width="120"> </el-table-column> <el-table-column prop="urgent" label="是否紧急" width="120"> <template slot-scope="scope"> <span>{{ scope.row.urgent | urgentText }}</span> </template> </el-table-column> <el-table-column prop="content" label="事项详情"></el-table-column> <el-table-column label="操作" width="160"> <template slot-scope="scope"> <el-button @click="handleDelete(scope.$index)" type="danger" size="small" >删除</el-button > <el-button type="primary" size="small" @click="handleComplete(scope.$index)" :disabled="scope.row.isComplete === 1" >完成</el-button > </template> </el-table-column> </el-table> <div style="text-align:left"> 总共:{{ todoList.length }} 个任务。 已完成:{{ count(1) }} 个任务。未完成:{{ count(0) }} 个任务。 </div> </div></template><script>import { mapGetters, mapMutations } from "vuex";import { COMPLETE_TODO, DEL_TODO } from "../store/types";export default { methods: { ...mapMutations([COMPLETE_TODO, DEL_TODO]), handleDelete(index) { this.DEL_TODO({ index }); }, handleComplete(index) { this.COMPLETE_TODO({ index }); }, tableRowClassName({ row }) { if (row.isComplete === 1) { return "complete-row"; } return ""; } }, computed: { ...mapGetters(["todoList", "count"]) }, filters: { urgentText(value) { if (value === 0) { return "紧急"; } return "非紧急"; } }, data() { return { tableData: [] }; }};</script><style>.el-table .complete-row { background: #f0f9eb;}</style>
- 2. 小结 在有些适合使用表格布局但又不是表格的情况下,可以利用 display 属性来模仿表格的行为:display: table; 相当于把元素的行为变成 <table></table>;display: inline-table; 相当于把元素的行为变成行内元素版的 <table></table>;display: table-header-group; 相当于把元素的行为变成 <thead></thead>;display: table-row-group; 相当于把元素的行为变成 <tbody></tbody>;display: table-footer-group; 相当于把元素的行为变成 <tfoot></tfoot>;display: table-row; 相当于把元素的行为变成 <tr></tr>;display: table-column-group; 相当于把元素的行为变成 <colgroup></colgroup>;display: table-column; 相当于把元素的行为变成 <col></col>;display: table-cell; 相当于把元素的行为变成 <td></td>或<th></th>.;display: table-caption; 相当于把元素的行为变成 <caption></caption>。
- 2.3 create和select 这种方法先创建一个新的存储引擎表,再通过 insert xxx select xxx 语法导入数据mysql> create table t1( -> c1 int not null, -> c2 varchar(10) default null -> ) engine = myisam;Query OK, 0 rows affected (0.02 sec)mysql> create table t1_innodb like t1;Query OK, 0 rows affected (0.01 sec)mysql> alter table t1_innodb engine = innodb;Query OK, 0 rows affected (0.06 sec)Records: 0 Duplicates: 0 Warnings: 0mysql> insert into t1_innodb select * from t1;Query OK, 0 rows affected (0.00 sec)mysql> show create table t1_innodb\G;*************************** 1. row *************************** Table: t1_innodbCreate Table: CREATE TABLE `t1_innodb` ( `c1` int(11) NOT NULL, `c2` varchar(10) DEFAULT NULL) ENGINE=InnoDB DEFAULT CHARSET=utf81 row in set (0.00 sec)
table相关搜索
-
tab
table
tableau
tablelayout
table样式
taif
tail
talk
tamcat
tan
target属性
task
tbody
tcl tk
TCP IP
tcp ip协议
tcpdump
tcpip
tcpip协议
tcp连接