table 样式详解

1.table 中css样式控制border 只能控制外边框,内边框需要写<table border="1">

2.table 会自动撑大,即使td 设置了 width和height这与div 是不同的

3.只有一个table的时候 ,高度自适应全屏

 <style type="text/css">table ,td,body{padding: 0;margin: 0;}html,body{height:100%;font-size:12px;}td {border:1px solid red;font-size: 12px;color: #000000;}#main{border:1px solid red;width:100%;height:100%;}#header{height:94px;border:1px solid red;}</style>
</head>
<body>
<table id="main"><tr><td id="header">我的顶部</td></tr><tr><td>我是主要内容</td></tr>
</table>
</body>

 

4.table可以为 td设置 border-radius 属性

5.多个元素的时候,最后一个元素高度要自适应全屏(高度计算时,table 的border无论设置多大都不影响,也就是说border是包含在计算的高度中的,这个与div不同)

 <style type="text/css">table, td, body{ padding:0; margin:0; }table{ border-collapse:collapse; }.he1{ width:100%; height:200px; background:black; }.he2{ width:100%; height:100px; background:red; }</style><script>$(document).ready(function () {var h1 = $(".he1").height();var h2 = $(".he2").height();$("#main").height($(window).height()-h1-h2);});</script>
</head>
<body>
<div class="he1"></div>
<div class="he2"></div>
<table id="main" border="5"><tr><td id="header">我的顶部</td></tr><tr><td>我是主要内容</td></tr>
</table>
</body>

 

 

转载于:https://www.cnblogs.com/haigui-zx/p/6296267.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/572810.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

spring整合

spring整合hibernate&#xff0c;整合什么&#xff1f; 1. Spring 整合 Hibernate 整合什么 ?1). 有 IOC 容器来管理 Hibernate 的 SessionFactory 2). 让 Hibernate 使用上 Spring 的声明式事务2. 整合步骤:1). 加入 hibernate ①. jar 包 ②. 添加 hibernate 的配置文件: hi…

看看大货车到底有多少盲区,肯定用得到!救命的!

上路的司机都知道&#xff0c;一旦看到大货车就要离它远远的&#xff0c;因为大货车的盲区大。可是又有多少轿车司机懂得盲区在哪里呢?不仅是轿车司机&#xff0c;许多行人和非机动车辆对于大货车的盲区也是一知半解&#xff0c;常常有人因此丧命。 行人篇 先给大家看一张最直…

msgpack java lua_使用lua-cmsgpack序列化和反序列化lua对象

原文在简书首发&#xff1a;http://www.jianshu.com/p/badf412db4e7lua-cmsgpack是一个开源的MessagePack实现方式、纯C的库&#xff0c;没有任何其它依赖&#xff0c;编译后可以直接被lua调用&#xff0c;目前主要支持Lua5.1/5.2/5.3 版本。1、什么是MessagePack&#xff1f;-…

全国250米DEM数据

全国250米DEM数据 DEM是数字高程模型的英文简称(Digital Elevation Model)&#xff0c;是研究分析地形、流域、地物识别的重要原始资料。由于DEM 数据能够反映一定分辨率的局部地形特征&#xff0c;因此通过DEM 可提取大量的地表形态信息&#xff0c;可用于绘制等高线、坡度图、…

redis集群连接 java_Redis分布式集群和直连的Java客户端调用方式详解

jedis是一个著名的key-value存储系统&#xff0c;而作为其官方推荐的java版客户端jedis也非常强大和稳定&#xff0c;支持事务、管道及有jedis自身实现的分布式。在这里对jedis关于事务、管道和分布式的调用方式做一个简单的介绍和对比&#xff1a;一、普通同步方式最简单和基础…

java爬虫新浪微博_java爬虫(爬新浪新闻) 如何从零开始

爬虫通常搜索引擎处理的对象是互联网网页。首先面临的问题是&#xff1a;如何能够设计出高效的下载系统&#xff0c;以将如此海量的网页数据传送到本地&#xff0c;在本地形成互联网网页的镜像备份。网络爬虫即起此作用&#xff0c;它是搜索引擎系统中很关键也很基础的构件。爬…

CodeVS 1068-乌龟棋

原题 题目描述 Description 小明过生日的时候&#xff0c;爸爸送给他一副乌龟棋当作礼物。 乌龟棋的棋盘是一行N个格子&#xff0c;每个格子上一个分数&#xff08;非负整数&#xff09;。棋盘第1格是唯一 的起点&#xff0c;第N格是终点&#xff0c;游戏要求玩家控制一个乌龟棋…

乔布斯传

资料参考 http://www.ruanyifeng.com/blog/2013/03/apple_inc_and_division_of_labor.html 苹果公司与分工原理 1.乔布斯 "乔布斯买了一间不错的房子&#xff0c;但家里只有一幅帕黎思&#xff08;Maxfield Parrish&#xff09;的画作、一部百灵牌咖啡机和几把双人牌的刀子…

ie11浏览器可以下载java吗_解析:WindowsXP系统能否安装IE11浏览器

现在&#xff0c;IE浏览器可以称得上是市场占有率最高的一款网页浏览器。因为windowsxp是一款比较久的操作系统&#xff0c;所以很多用户都会疑惑在xp上是否能够安装最新版的ie11浏览器。下面&#xff0c;小编就给大家详细解答下该问题。很遗憾的告诉大家&#xff0c;Windows X…

java ajax传输图片_Java使用Ajax实现跨域上传图片功能

说明 &#xff1a;图片服务器是用Nginx搭建的&#xff0c;用的是PHP语言这个功能 需要 用到两个js文件&#xff1a;jquery.js和jQuery.form.jsfunction submitImgSize1Upload() {var postData function( form , callback){var form document.getElementById("upload-for…

Java并发——线程中断学习

1. 使用interrupt()中断线程当一个线程运行时&#xff0c;另一个线程可以调用对应的Thread对象的interrupt()方法来中断它&#xff0c;该方法只是在目标线程中设置一个标志&#xff0c;表示它已经被中断&#xff0c;并立即返回。这里需要注意的是&#xff0c;如果只是单纯的调用…

分布式服务框架原理(一)设计和实现

分布式服务框架设计 分布式服务框架一般可以分为以下几个部分&#xff0c; &#xff08;1&#xff09;RPC基础层&#xff1a; 包括底层通信框架&#xff0c;如NIO框架、通信协议&#xff0c;序列化和反序列化协议&#xff0c;以及在这几部分上的封装&#xff0c;屏蔽底层通信细…

saltstack之混合匹配

需要-C参数: salt -C ## 使用grains属性来匹配 [roothadoop0 pillar]# salt -C Gos:Ubuntu test.ping uadoop1:True ## 使用Minion ID的正则表达式来匹配 [roothadoop0 pillar]# salt -C Euadoop\d test.ping uadoop2:True uadoop3:True uadoop1:True ## 使用gr…

java自定义 filter,HBase自定义Filter

必需要提前说明下&#xff1a;不建议使用自定义的Filter。所有的Filter都是在服务端生效&#xff1a;就是说需要将自定义的Filter封装为jar&#xff0c;上传到HBase的类路径下&#xff0c;并重启HBase使之生效。对于生产环境的HBase来说&#xff0c;重启通常是不能接受的。Filt…

Mybatis学习总结(二)——Mapper代理开发

一、概要 1、原始DAO开发中存在的问题:&#xff08;1&#xff09;DAO实现方法体中存在很多过程性代码。&#xff08;2&#xff09;调用SqlSession的方法(select/insert/update)需要指定Statement的id&#xff0c;存在硬编码&#xff0c;不利于代码维护。 2、Mapper动态代理方法…

mac wordpress php7,Mac 下基于 wordpress 搭建个人博客系统

一、前言这里说的是自己从 wordpress 源码开始搭建一个个人博客系统。当然&#xff0c;很多云端已经直接提供了在线安装的方式&#xff0c;这个就不在本文的讨论范围之内了。二、关于 wordpresswordpress是一款个人博客系统&#xff0c;并逐步演化成一款内容管理系统软件&#…

TypeError: db.addUser is not a function : @(shell):1:1 ——mongoDB创建新用户名密码的方法...

不多说&#xff0c;旧版本使用 db.addUser("root","root") 新版本使用这句会出现这个错误提示 TypeError: db.addUser is not a function : (shell):1:1 新版本用的是 db.createUser({user: "test",pwd: "test",roles: [ { role: &quo…

java开发技术有什么意义,零基础学Java开发技术有哪些优势和好处?

零基础学Java开发技术有哪些优势和好处&#xff1f;Java开发技术有下列优势&#xff1a;Java编程语言简单、面向对象集中于对象及其接口、分布式处理TCP/IP协议、鲁棒性、安全性、体系结构中立性、可移植性、解释执行、高性能、多线程以及动态性等。零基础学Java开发技术的优势…

C#-WebForm-★★★JQuery知识——基础知识、选择器、事件★★★

JQuery 与 JS 之间的转换 将JQuery转换为JS —— get(0)  例如&#xff1a;alert( $("#d1").get(0).offsetwidth ); 将JS 转换为JQuery —— $(" ")  例如&#xff1a;$("#d1").click(function(){}); 1、什么是JQuery&#xff1f;   它就是…

事件对象及其属性

$(function(){$(input).bind(click,function(e){alert(e); //获取对象//event对象的属性alert(e.type);alert(e.target);alert(e.currentTarget);//得到监听元素的DOM&#xff0c;target是点的那个的DOM});$(input).bind(mouseover,function(e){alert(e.relatedTarget);});$(in…