表格属性(特有)

表格特有属性

  1.边框合并属性

属性

  border-collapse

            取值

1.separate  代表不合并

                2.collapse  代表合并

  2.边框边距

            属性:

border-spacing:

            作用:

 设置相邻两个边框的距离

            前提:

border-collapse取值一定是separate

            取值

1.值;      水平和垂直都一样

                2.  值1       值2; 

  水平方向   垂直方向

border-spacing:设置边框边距;

       设置边框前提border-collapse取值为sparete(不合并),

       当然border-collapse取值还有collaps(合并),在sparate(不合并)下才能进行表格边框边距设置;

       border-spacing取值一个值表示水平数值全部一样,两个值的话是:第一个值(水平),第二个(垂直)边距;

<style>
.t1{border-collapse:separate;
/*border-collapse:表格是否合并取值collapse合并,separete不合并*/

border-spacing:5px;
/*当边框不合并取值为separete时候可以进行外边距设置*/
/*一个值表示上下左右一样 两个值:第一个表示上下 第二个表示作业 */
table-layout:fixed;
/*显示规则table-layout默认auto自动计算,fixed根据自己设置排布*/
width:500px;
height:350px;
text-align: right;
vertical-align: top;

}

3.显示规则

            1.作用

规定单元格的 宽度 和 高度 处理方式

            2.属性

table-layout:

                取值

                    1.auto

  默认,自动计算单元格的宽和高

                    2.fixed

固定表格布局

table-layout:fixed;
/*显示规则table-layout默认auto自动计算,fixed根据自己设置排布*/

            3.对比

                1.自动表格布局table-layout:auto;

1.单元格大小会根据内容自动调整

                    2.加载复杂的表格速度比较慢

                    3.适用于不确定每列的内容大小

                2.固定表格布局table-layout:fixed;

1.单元格大小和内容无关

                    2.加载复杂表格相对较快

                    3.适用于每列内容固定的情况

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏我的博客

安卓开发之简单组件使用

一、TextView组件(文本框) <TextView android:id=”@+id/firstText” android:text=”第一行“ andro...

2776
来自专栏Python Web学习记录及整理

CSS学习记录及整理

<!DOCTYPE ”此文仅为个人学习的知识梳理,权威且更详细的内容请查阅w3school。“>

4408
来自专栏用户2442861的专栏

HTML/CSS基础知识学习笔记

http://www.cnblogs.com/scue/p/4276339.html

1361
来自专栏Android先生

Flutter组件学习(一)—— Text组件

之前说会给大家一一讲解 Flutter 中的组件,今天咱们就从 Text 组件开始,无图言X,先上图:

1352
来自专栏编程

【CSS】格仔背景

CSS代码 * { margin: 0; padding: 0; } html, body { width: 100%; height: 100%; } bod...

24410
来自专栏有趣的Python

安卓基础知识-layout布局详解。

安卓基础知识 1. 目录结构: src存放java源代码。 gen存放系统自动生成的配置文件 res存放应用用到的所有资源文件,如图片,布局等等 drawabl...

3005
来自专栏Nian糕的私人厨房

CSS 基础

层叠样式表 (Cascading Style Sheets),一种用来为结构化文档(如 HTML 文档或 XML 应用)添加样式(字体、间距和颜色等)的计算机语...

1124
来自专栏一个爱吃西瓜的程序员

Web前端基础【2】--CSS基础

CSS指层叠样式表,用来定义如何显示HTML元素,一般和HTML配合使用。CSS样式表的目的是为了解决内容与表现分离的问题:即使同一个HTML文档也能表现出外观...

3396
来自专栏淡定的博客

css3的一些新属性总结

box-sizing规定了盒子的计算方式,常用于消除hover时,盒子之间的影响,有三个属性:

761
来自专栏向治洪

react-native 之布局总结

前言 之前我们讲了很多react-native的基础控件,为了方便大家的理解,我们来对react-native的布局做一个总结,观看本节知识,你将看到。 宽度单...

6418

扫码关注云+社区