Question

你好伙伴有一个在桌子外面的div，我希望div在用户最小化屏幕时保持相同的大小。这就是它的作用：

基本上我希望宽度保持在60％并且在我最小化页面时不缩小：

CSS：

message_box,

{
background-color:#EEEECC;
border: #CCCCAA thin solid;
margin: 0 auto;
padding: 5px;
text-align: center;
font-family: arial, sans-serif;
font-size: 10pt;
margin-bottom: 10px;
}

HTML：

<div class="message_box" style="width: 60%">

Answer 1

当您将元素设置为width:60%时，这意味着该元素的宽度将是其父元素的60％。

如果<div class="message_box">的父元素变窄，那么<div class="message_box">也会变得更窄。

当您说<div class="message_box">宽度为60％时，您究竟是什么意思？ 60％的是什么？

如果您希望<div class="message_box">的宽度为特定像素数，并且在用户调整浏览器窗口大小时不会更改，则应设置其宽度（以像素为单位），例如：

<div class="message_box" style="width: 300px">

Answer 2

假设通过“最小化”表示当用户调整窗口大小时，您希望div保持其父元素的60％。在这种情况下，这样的事情应该有效：

.message_box{
    background-color:#EEEECC;
    border: #CCCCAA thin solid;
    margin: 0 auto;
    padding: 5px;
    text-align: center;
    font-family: arial, sans-serif;
    font-size: 10pt;
    margin-bottom: 10px;
    position:absolute;
    left:0;
    right:60%;
}

如果div具有父元素，请确保此元素具有宽度设置且具有css属性position:relative

Answer 3

你应该保持静态，分配像素值600px（或任何你想要的大小）。

CSS在最小化屏幕时将div保持为固定宽度

3 个答案: