[已解决]怎样让页面结构不随窗口大小而改变

sunbocheng

像京东，新浪这类网站你缩小窗口，顶多是看不到了，但是我这里一动窗口结构就变了，是为什么呢？

1. <div class="con6">
   
2.     <p>
   
3.     </p>
   
4. </div>
   
5. <div class="con6">
   
6.     <p>
   
7.     </p>
   
8. </div>
   
9. <div class="con6">
   
10.     <p>
    
11.     </p>
    
12. </div>
    
13. 
    
14.   .con6{
    
15.             width: 340px;
    
16.             height: 180px;
    
17.             border-radius: 1em ;
    
18.             background: blue;
    
19.             display: inline-block;
    
20.             margin: 0 20px;
    
21.         }

复制代码

最佳答案

月排行榜 / 总排行榜

不二如是

2017-10-8 10:58:50

设置display为“display-blcok”，意味着：

        简单来说就是将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。

说的再通俗些：

        设置完display-block的元素，即可以拥有块级元素（浮动，可调整高度）和行内元素（可调整左右边距，多个元素同一行显示）的特点

效果：

---

需求：缩小窗口后页面结构不变

div本身是块级元素（每个元素独占一行），取消display设置：

1.    .con6{
   
2.             width: 340px;
   
3.             height: 180px;
   
4.             border-radius: 1em ;
   
5.             background: blue;
   
6.             margin: 0 10px;
   
7.         }

复制代码

等同于设置：

1. display: block;

复制代码

跳转到最佳答案楼层

不二如是

设置display为“display-blcok”，意味着：

        简单来说就是将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。

说的再通俗些：

        设置完display-block的元素，即可以拥有块级元素（浮动，可调整高度）和行内元素（可调整左右边距，多个元素同一行显示）的特点

效果：

---

需求：缩小窗口后页面结构不变

div本身是块级元素（每个元素独占一行），取消display设置：

1.    .con6{
   
2.             width: 340px;
   
3.             height: 180px;
   
4.             border-radius: 1em ;
   
5.             background: blue;
   
6.             margin: 0 10px;
   
7.         }

复制代码

等同于设置：

1. display: block;

复制代码

sunbocheng