Question

我在个人网站上工作，而不是响应式网站，但我只想拥有相同的＆＃34;布局＆＃34;至少在不同的屏幕之间（不是移动的）。

例如：

<div class="first-div">
   <div class="second-div"></div>
</div>

CSS看起来像：

.first-div{
  width:100%;
  height:100%;
  background-color:blue;
 }

.second-div{
   width:1380px;
   height:1000px;
   background-color:red;
 }

当我在我的13＆＃34;屏幕红色（第二个div）很安静，但是，在另一台笔记本电脑（甚至13＆＃34;）中，我必须水平滚动才能看到所有第二个div（红色的一个）。

我的问题是即使我不想要响应式设计，设置的宽度是多少？

Answer 1

我想通过使用same "layouting"和same “width”来表示百分比大小调整。

如果您将css更改为此示例并将第一个div设为position: relative：

.first-div{
  width:100%;
  height:100%;
  background-color:blue;
  position: relative; 
 }

.second-div{
   width:95%;
   height:95%;
   background-color:red;
 }

你几乎可以在每个屏幕上获得相同的布局，例如第一个div填满整个屏幕而第二个只获得95％

Answer 2

你可以尝试

.first-div{
  width:100%;
  height:100%;
  background-color:blue;
 }

.second-div{
  margin:0px auto;
  width:98%;
  height:98%;
  background-color:red;
}

Answer 3

如果您使用固定宽度，则某些屏幕必须滚动。

你在这里混合相关和固定。

如果您想确保它没有超过某个限制，请使用$output = exec("cd $blender_path && ./blender -b -P $script", $data);，并接受某些屏幕无法按预期工作。

我怎样才能得到相同的宽度＆＃34;？

3 个答案: