覆盖并重置CSS样式：auto或none都不起作用
我想覆盖下面为所有表定义的CSS样式：
table { font-size: 12px; width: 100%; min-width: 400px; display:inline-table; } 我有一个名为'other'具体表。
最后桌子的装饰应该看起来像：
table.other { font-size: 12px; }
所以我需要删除3个属性： width ， min-width和display
我试图重置none或auto ，但没有帮助，我的意思是这些情况下：
table.other { width: auto; min-width: auto; display:auto; } table.other { width: none; min-width: none; display:none; }
我相信为什么第一组属性不起作用是因为没有auto display值，所以属性应该被忽略。 在这种情况下， inline-table将仍然生效，并且由于width不适用于inline元素，该属性集合将不会执行任何操作。
第二组属性将简单地隐藏表格，因为这是display: none用于。
尝试将其重置为table ：
table.other { width: auto; min-width: 0; display: table; }
编辑： min-width默认为0 ，不auto
“无”不会做你认为它做的事情。 为了“清除”一个CSS属性，你必须将其设置回它的默认值，这是由CSS标准定义的。 因此，您应该查看您最喜爱的参考中的默认值。
table.other { width: auto; min-width: 0; display:table; }
一个表的默认display属性是display:table; 。 唯一的其他有用的值是inline-table 。 所有其他display值对于表格元素都是无效的。
没有一个auto选项将其重置为默认值，但是如果您使用的是Javascript，则可以将其设置为空string，这将会起到诀窍的作用。
width:auto; 是有效的，但不是默认的。 表的默认宽度是100% ，而width:auto; 将使元素只占用尽可能多的宽度，因为它需要。
min-width:auto; 是不允许的。 如果您设置min-width ，它必须有一个值，但将其设置为零可能会重置为默认值。
Set min-width: inherit /* Reset the min-width */
尝试这个。 它会工作。
那么， display: none; 根本不会显示表格，请尝试display: inline-block; 宽度和最小宽度声明保持“自动”。
我结束了使用Javascript来完善一切。
我的JS小提琴： https : //jsfiddle.net/QEpJH/612/
HTML：
<div class="container"> <img src="http://placekitten.com/240/300"> </div> <h3 style="clear: both;">Full Size Image - For Reference</h3> <img src="http://placekitten.com/240/300">
CSS：
.container { background-color:#000; width:100px; height:200px; display:flex; justify-content:center; align-items:center; overflow:hidden; }
JS：
$(".container").each(function(){ var divH = $(this).height() var divW = $(this).width() var imgH = $(this).children("img").height(); var imgW = $(this).children("img").width(); if ( (imgW/imgH) < (divW/divH)) { $(this).addClass("1"); var newW = $(this).width(); var newH = (newW/imgW) * imgH; $(this).children("img").width(newW); $(this).children("img").height(newH); } else { $(this).addClass("2"); var newH = $(this).height(); var newW = (newH/imgH) * imgW; $(this).children("img").width(newW); $(this).children("img").height(newH); } })
