时间戳

首页 > 解决方案 > 使 div 与另一个 div 响应

html - 使 div 与另一个 div 响应

问题描述

我是 HTML 和 CSS 的新手，我想制作一个响应式标题，其中包含：

没有引导程序。你有什么建议来实现这一目标？到目前为止我所做的没有响应，在全尺寸（宽度：1920px）上测量很好，它看起来完全应该如何，但是当我尝试调整浏览器大小时它不在一行中，即使我声明 div “包含它们的内部“是宽度：100％，它们也是宽度：100％。

代码是这样的：

.inner{
      width:100%;
    }
    .navigation {
    display: inline-block;
    float: right;
    text-align: center;
    padding-top:47px;
    padding-bottom:27px;
    max-width:1555px;
    width:100%;
    }

    .navigation li{
      display: inline-block;
      width: 16%;
    }

    .navigation ul{
      max-width: 1500px;
    }

    .wrapper-logo{
      display: inline-block;
      max-width:365px;
      width:100%;
    }
    .small-logo{
      max-width: 143px;
      width:100%;
      padding-left:220px;
    }
    
    <div class="inner">
       <div class="logo-wrapper">
           <div class="small-logo">
               <img src="https://99designs-start-attachments.imgix.net/alchemy-pictures/2016%2F02%2F22%2F04%2F24%2F31%2Fb7bd820a-ecc0-4170-8f4e-3db2e73b0f4a%2F550250_artsigma.png?auto=format&ch=Width%2CDPR&w=250&h=250">
           </div>
       </div>
       <div class="navigation">
        <ul><li>......</li></ul>
       </div>
    </div>

标签： htmlcssresponsive

解决方案

使用媒体查询。

Here goes my Desktop resolution css 

    @media only screen and (max-width: 600px) {

    /* Here goes my Mobile resolution css */

        body {
            background-color: lightblue;
        }
    }

推荐阅读