【JavaWeb】html中有关table、tr和td的宽度和高度设置

2024-04-18 12:48

本文主要是介绍【JavaWeb】html中有关table、tr和td的宽度和高度设置,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

做网页的时候可能会遇到表格宽度对不齐的问题。

首先,来分析一下这三个标签中heightwidth的区别

 1table中的widthheight设置及其作用:

table中设置的height其实是设置一个最小值,也就是当表格中的内容或者行高总值超过这个设置值时,会自动延长表格的height,当表格中的内容或者行高没有达到这个值时,会自动扩大到这个值。

table中设置的width一般为表格宽度的最大值,不能改变,即使内部的内容宽度超过也不能改变。(这个内部内容如果是图片的话是可以改变表格宽度的。)

 2tr标签中widthheight设置及其作用:

tr标签里面的width设置不起任何作用,因为从第一点可以看出,表格的width是不能改变的,tr标签当然就不起作用了。

所以在tr中只有讨论height设置的可能了,tr中的height设置和几个tr之间的设置有关。

当几个tr都设置了height的具体数值时,各个trheight按照设置的值的比例来分配总的height,注意这里说的是总的height值。

当几个tr都没有设置height具体值时,平均分配总的height

当有的tr设置了具体的数值,有的没有设置具体的数值为默认时,先保证各个tr的基本需要,剩下的再满足设置了具体值的tr,之后再全部给没有设置具体值的tr

最后一种情况还要考虑总的宽度不够tr总的设置值的情况,不够的话要满足tr的基本需要,这里会自动延长表格的height。然后再考虑设置了heighttr,最后考虑没有设置heighttr

3td标签中widthheight设置及其作用:

td标签里面的widthheight都是起作用的。先看tdwidth吧,某一个tdwidth是和所处的一列每个tdwidth都相关的,其中最大的width作为这一列中每个tdwidth,一定要从全局把握某个tdwidth,不能从这一个的width设置就断言它的宽度就是多少,这样是不准确的。

当我们把每一列的宽度都弄清楚之后,事情就好办了。这时候各个td之间的宽度分配按照第二条中各trheight分配规律,

有一点不同的是全部是默认的情况下,tdwidth不是平均分配,而是根据各自的实际内容按比例分配

再看看tdheight设置吧,各个tdheight要看这个td所在的行的最大高度来确定这一行的每个tdheight,然后各个行的高度情况和tr中的height分配原则是一样的。

还有一点要注意,就是tdheighttrheight之间的关系。首先肯定是根据内容的需要,在这个基础上,再根据设置的值来确定,哪个设置的值大就按照哪个,如果一个设置了值一个没有设置值,那么按照设置值的算。

本文转自:http://www.cnblogs.com/limeiky/p/5749355.html。

这篇关于【JavaWeb】html中有关table、tr和td的宽度和高度设置的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/914826

相关文章

Java中的String.valueOf()和toString()方法区别小结

《Java中的String.valueOf()和toString()方法区别小结》字符串操作是开发者日常编程任务中不可或缺的一部分,转换为字符串是一种常见需求,其中最常见的就是String.value... 目录String.valueOf()方法方法定义方法实现使用示例使用场景toString()方法方法

Java中List的contains()方法的使用小结

《Java中List的contains()方法的使用小结》List的contains()方法用于检查列表中是否包含指定的元素,借助equals()方法进行判断,下面就来介绍Java中List的c... 目录详细展开1. 方法签名2. 工作原理3. 使用示例4. 注意事项总结结论:List 的 contain

Java实现文件图片的预览和下载功能

《Java实现文件图片的预览和下载功能》这篇文章主要为大家详细介绍了如何使用Java实现文件图片的预览和下载功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... Java实现文件(图片)的预览和下载 @ApiOperation("访问文件") @GetMapping("

Spring Boot + MyBatis Plus 高效开发实战从入门到进阶优化(推荐)

《SpringBoot+MyBatisPlus高效开发实战从入门到进阶优化(推荐)》本文将详细介绍SpringBoot+MyBatisPlus的完整开发流程,并深入剖析分页查询、批量操作、动... 目录Spring Boot + MyBATis Plus 高效开发实战:从入门到进阶优化1. MyBatis

SpringCloud动态配置注解@RefreshScope与@Component的深度解析

《SpringCloud动态配置注解@RefreshScope与@Component的深度解析》在现代微服务架构中,动态配置管理是一个关键需求,本文将为大家介绍SpringCloud中相关的注解@Re... 目录引言1. @RefreshScope 的作用与原理1.1 什么是 @RefreshScope1.

Java并发编程必备之Synchronized关键字深入解析

《Java并发编程必备之Synchronized关键字深入解析》本文我们深入探索了Java中的Synchronized关键字,包括其互斥性和可重入性的特性,文章详细介绍了Synchronized的三种... 目录一、前言二、Synchronized关键字2.1 Synchronized的特性1. 互斥2.

Spring Boot 配置文件之类型、加载顺序与最佳实践记录

《SpringBoot配置文件之类型、加载顺序与最佳实践记录》SpringBoot的配置文件是灵活且强大的工具,通过合理的配置管理,可以让应用开发和部署更加高效,无论是简单的属性配置,还是复杂... 目录Spring Boot 配置文件详解一、Spring Boot 配置文件类型1.1 applicatio

JSON Web Token在登陆中的使用过程

《JSONWebToken在登陆中的使用过程》:本文主要介绍JSONWebToken在登陆中的使用过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录JWT 介绍微服务架构中的 JWT 使用结合微服务网关的 JWT 验证1. 用户登录,生成 JWT2. 自定义过滤

Java中StopWatch的使用示例详解

《Java中StopWatch的使用示例详解》stopWatch是org.springframework.util包下的一个工具类,使用它可直观的输出代码执行耗时,以及执行时间百分比,这篇文章主要介绍... 目录stopWatch 是org.springframework.util 包下的一个工具类,使用它

Java进行文件格式校验的方案详解

《Java进行文件格式校验的方案详解》这篇文章主要为大家详细介绍了Java中进行文件格式校验的相关方案,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、背景异常现象原因排查用户的无心之过二、解决方案Magandroidic Number判断主流检测库对比Tika的使用区分zip