当窗口大小调整时，网站内容会移动

-2

我已经创建了一个网站，并且我遇到了问题，因为每次调整窗口大小时，网站中的内容都会移动并且不会保持有序。当窗口大小调整时，网站内容会移动

我能做些什么来解决这个问题？非常感谢！

这里是我的webite一个代码示例：

<section class="nav-panel nav-color" id="nav-panel-2"> 
    <div class="img"> 
     <a target="_blank" href="images/Starters/starters1.jpg"> 
     <img src="images/Starters/starters1.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Fried Ravioli</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/Starters2.jpg"> 
     <img src="images/Starters/starters2.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Cheese Bread</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/breadsticks.jpg"> 
     <img src="images/Starters/breadsticks.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Garlic Bread</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/mozzarellaSticks.jpg"> 
     <img src="images/Starters/mozzarellaSticks.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Mozzarella Sticks</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/wings.jpg"> 
     <img src="images/Starters/wings.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Chicken Wings</div> 
    </div> 
    </section>

来源

2016-06-07 Alisinna

您需要更具体地解释问题并添加一些代码示例。 – TheDrot

嘿尝试阅读有关响应网页设计。同时将网站的div宽度更改为实际宽度的百分比，并正确设置边距。 – user1234

@TheDrot我现在添加了一个代码示例:)希望它有帮助！ – Alisinna

你必须对你的CSS工作。编辑浮点数，高度，宽度，最大宽度等来创建响应式网站。您需要使用JavaScript和JQuery等插件来进一步增强您网站的吸引力。

一般来说，这个问题不会给你任何回应或答案。加入一些教程或有关响应式Web开发的内容。

来源

2016-06-07 12:01:41

请勿使用边距和填充属性来居中放置元素。创建一个包装div，然后设置边距：0 auto;到它。

来源

2016-06-07 12:03:43

您可以给位置：绝对或固定的样式。示例。 #div{ position:absolute; }

来源

2016-06-07 12:05:38

当窗口大小调整时，网站内容会移动

回答

相关问题