html表格宽度设置失效

问题描述:

我在写一个网页table时,table宽度超过了我预想的宽度,我想把它设置小一点,但总是没效果。改到怀疑人生!代码如下:

经过多次调试后发现一个问题,table可以改变大小,但是会有一个最小值,低于最小值时,数值修改会无效,table大小始终是最小值。后灵机一动,把问题锁定在input标签上。思考时认为,表格大小有最小值是因为里面有东西把它撑大了,所以不能更小了。想到后,代码改动如下,效果就让我很满意了。

总结,该问题的出现是因为input标签有默认的宽度和高度,而在对表格的宽高度进行设置时是没办法对内部的标签做出改变的,你可以比它大,但不能比它小。因此在做表格的样式布局时,也同样需要考虑内部标签的大小位置。

同时,以后遇到bug时要提醒自己,遇到问题总是自己的代码有问题,按照逻辑一点点去尝试去修改,去深入理解,去思考内部一点的东西,不要放过任何可能。

时间: 2024-11-07 05:10:46

html表格宽度设置失效的相关文章

Word批量设置表格宽度自动适应页面宽度

怎么批量修改Word表格的宽度呢.Word表格可根据窗口自动调整表格宽度,使得所有的表格宽度和页面宽度一样. 当页面设置了新的页边距后,所有的表格都需要调整新的宽度.或者文档中有许多大大小小的表格,希望宽度全部调整与页宽一样.下面的方法就非常有用啦 步骤阅读 百度经验:jingyan.baidu.com 工具/原料 Word 2013 百度经验:jingyan.baidu.com 方法/步骤 1 打开Word文档,按下[Alt + F11] 步骤阅读 2 在VBA编辑器窗口的左上方,双击[Thi

table拖动(兼容Firefox 3.5/IE6),固定表格宽度

效果:可鼠标拖动td,动态修改它们的宽度 html: <html> <head> <title>table拖动(兼容Firefox 3.5/IE6),固定表格宽度</title> <meta content="charset=utf-8"> <link rel="stylesheet" href="css/22.css" /> </head> <body&g

LODOP打印table表格宽度固定-超宽隐藏

之前有博文介绍关于超出div隐藏内容的:LODOP打印超过后隐藏内容样式里面提到了overflow:hidden;控制超出后隐藏,但是前面那篇用的是div,如果是在table中,由于table默认的table-layout是auto自动,虽然设置了超出隐藏,也设置了具体的td单元格宽度,设置了table的具体宽度,但是因为这个able-layout是auto还在,内容超过设置的宽度,表格宽度也会发生变化,设置的具体的td的宽度也没有完全按照设置的宽度进行布局. 前面还有篇是介绍固定table宽高

缩放窗口时随一个div宽度设置另一个div的宽度

1.获取页面的宽度 window.onresize=findDimensions;    function findDimensions() //函数:获取尺寸    {    //结果输出至两个文本框        $("#heightscrollbardivtwo").width($("#heightscrollbardiv").width()+22);    } 缩放窗口时随一个div宽度设置另一个div的宽度,布布扣,bubuko.com

A4纸网页打印 html网页页面的宽度设置成多少

A4纸竖向打印,html网页页面的宽度设置成多少?这个问题是我们大家所疑惑的,于是网上搜集整理下,希望可以帮助你们 最近开发项目时遇到了网页打印的问题,这是问题之二,打印宽度设置 在公制长度单位与屏幕分辨率进行换算时,必须用到一个DPI(Dot Per Inch)指标. 经过我仔细的测试,发现了网页打印中,默认采用的是96dpi,并非传闻的72dpi A4纸张的尺寸是210×297mm,按1英寸=25.41mm换算,即8.264×11.688英寸 所以,A4纸96dpi下的分辨率是794×112

js获取input长度并根据页面宽度设置大小

1. js获取页面宽度高度及屏幕分辨率 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWidth (包括边线的宽) 网页可见区域高:document.body.offsetHeight (包括边线的宽) 网页正文全文宽:document.body.scrollWidth 网页正文全文高:document.body.scrollHeight 网页被卷去

div宽度设置无效问题解决

问题描述: 要设置两个div在同一行显示,都加入了display:inline样式,但是其中一个div的宽度设置无效,在浏览器显示它的宽度始终是1003px. 解决办法: 方法1/给div加入样式:float:left;//向左浮动,宽度设置有效,不能在目标位置显示. 方法2/给div加入样式:display:inline-block;//宽度设置有效,可设置任意位置显示. 原因: 块级对象元素会单独占一行显示,多个block元素会各自新起一行,并且可以设置width,height属性. 而内联

table-layout 表格宽度不随文字改变

1 table 2 { 3 table-layout:fixed; 4 } table-layout属性用来显示表格单元格.行.列的算法规则. fixed:水平布局仅取决于表格宽度.列宽度.表格边框宽度.单元格间距,而与单元格的内容无关. auto(默认):列的宽度是由列单元格中没有折行的最宽的内容设定的.此算法有时会较慢,这是由于它需要在确定最终的布局之前访问表格中所有的内容.

Excel2010表格里设置每页打印时都有表头

在打印Excel表格时常常会出现如果存在多页打印时,往往从第二页开始就会出现没有表头的情况,导致到后面都不清楚对应的是哪个数据,查看时也很麻烦,下面就将为大家介绍如何在Excel表格里设置每页打印时都有表头 1. 首先打开所要修改的Excel表格 2. 我们首先来看看第一页与第二页的区别 3. 打开菜单栏里面的"页面布局"选项卡 4. 点击页面设置板块中的"打印标题" 5. 在打印标题内有顶端标题行与左端标题行,选中顶端标题行,点击右边的小箭头 6. 点击小箭头后会