因此,我的网页中有div。例如标题或div框。它们在较大的屏幕尺寸上可以很好地调整,以使它们在大显示器上看起来不会太小,但是问题是当我调整窗口大小或浏览器使其变小,所有元素都会一直移动到它们相遇的位置,并且变得丑陋..如何使它适应已适应较大屏幕尺寸的div变大,但是又停止了它们从调整窗口大小使其与窗口一起移动时减小窗口?我使用了要重新调整并在更大/更宽的屏幕上放大的所有元素的百分比
下面是我的代码的示例..带有这些类的标头和其他元素移至调整窗口大小时重叠的位置
.header{
position:absolute;
top:0px;
width:100%;
height:100px;
left:0;
background:#EB6A4A;
}
.slogan{
position:absolute;
top:60%;
left:40.5%;
}
.login{
position:absolute;
top:15%;
left:90%;
}
.whitebackground{
background:#FFFFFF;
}
我不确定您的问题,因为您没有发布任何代码,但是我认为您的解决方案可以使用CSS样式:
max-width:50%;
min-width:800px;
max-height:500px;
min-height:21%;
属性可以根据需要选择以百分比或像素为单位,因此您可以告诉div扩展程度和缩小程度。
希望对您有所帮助,如果您发布代码,也许我会更有用。
问候
编辑1:
这应该可以解决您的问题:
*{
margin: 0;
padding: 0;
text-decoration: none;
color: inherit;
}
.header{
position:relative;
float:left;
top:0px;
width:100%;
height:100px;
left:0;
background:#EB6A4A;
}
.slogan{
position:relative;
float:left;
top:60%;
left:40.5%;
}
.login{
position:relative;
float:left;
top:15%;
left:90%;
}
.whitebackground{
background:#FFFFFF;
}
只需对您未在CSS中发布的课程进行相同的操作即可。想法是让所有具有相对位置的项目浮动在左侧,这样它们就不会移动。应该管用!
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句