css如何设置最小宽度是屏幕宽度 => style="min-width: 屏幕宽度">

Posted 2023-03-20

css如何设置最小宽度是屏幕宽度 =>
style="min-width: 屏幕宽度">

参考技术A 设置最小宽度min-width:*px
与最大宽度max-width:*px
看到你说的还想让此自适应屏幕大小，又不能用百分比来控制是吗？其实最好的方式就是百分比来控制；
第二种方式就是@media screen来判断一下屏幕的大小如：
@media screen and (min-width:360px)#tankuangwidth:*像素
当浏览器的宽度大于360px的时候执行弹框宽度是多少；
@media screen and (max-width:1440px)#tankuangwidth:*像素
当浏览器宽度小于1440px时执行弹框是多少，
希望我的回答对你有所帮助；如果还有疑问继续追问我；本回答被提问者和网友采纳 参考技术B 要随屏幕变化就要“max-width”追问

具体如何来写呢。

参考技术C min-width:100%;这样就可以了追问

我这里因为是一个弹出层 的界面，使用了float,所以不能用100%，而要使用一个固定的宽度，但是我这个固定的宽度，要随屏幕变化而设定。

如何使用css在列上设置自动最小宽度？

【中文标题】如何使用css在列上设置自动最小宽度？

【英文标题】：How to set an auto minimum width on column with css?

【发布时间】：2012-04-22 21:08:56

【问题描述】：

我正在尝试创建表格，其中两列是包含内容所需的最小宽度，第三列将尽可能宽。我确实知道这两列的宽度，它们不会有太大的变化，但我宁愿尽可能少的硬编码宽度。

这是我得到的：

​<table >
    <tr>
        <td align="left" style="width:auto;">
            123 123 123 123 123
        </td>
        <td align="center">
            bla bla
        </td>
        <td align="right" style="width:auto;">
            hello
        </td>
    </tr>
</table>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

第一列和最后一列占用的空间超出所需，导致中间列看起来不居中。有没有办法做到这一点，还是我应该硬编码宽度？

编辑：答案很简单。以下是完整答案，以防对其他人有所帮助：

​<table >
    <tr>
        <td align="left" style="white-space:nowrap;">
            123 123 123 123 123
        </td>
        <td align="center" >
            bla bla
        </td>
        <td align="right">
            hello
        </td>
    </tr>
</table>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

【参考方案1】：

为什么不使用百分比来表示宽度？宽度 100% 扩展列，如果列没有设置宽度，它会按比例添加剩余的列的其余部分。

【参考方案2】：

好吧，您的表格设置为 100% 宽度.. 它必须扩展一些东西 :-)

【讨论】：

是的，它为所有三列提供了额外的空间，但我只希望中间列获得额外的空间。

将中间列设置为 100% 宽度 :-)

是的......我以为我错过了一些简单的东西。我在想我需要对其他两列做点什么，而不是简单地让中间列完全展开。