引导“IMG响应”是不是在我的代码，为什么工作？

Question

我想打一个标志响应，所以我在外部样式表添加在img-reponsive标签类col-xs-12和img，同时指定width: 100%，但它无法正常工作。

我做了标志右侧，它有一台笔记本电脑，但所以我在img-responsive添加<img>和外部样式表指定width: 100% height: auto;和img-responsive，我还指定@media但它同样不是手机可见

#logo {
    padding-left: 380px;
    width: auto;
    height: 30%;
    position: fixed;
    float: right;
    border-bottom: 25px;
    padding-bottom: 25px;
    display: inline-block;
    top: -1em;
}
@media(max-width:568px) {
    #logo{
        float: right;
        padding-left: 300px;
        width: inherit;
        height: inherit;
        position: fixed;
    }
}
@media(max-width:767px) {
    #logo{
        float: right;
        padding-left: 200px;
        width: 100%;
        height: auto;
        position: fixed;
    }
}
.img-responsive{
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
}

<nav class="navbar navbar-default navbar-fixed-top d-flex">
    <div class="container">
        <div id="nav">
            <img src="images/logo.jpg" id="logo" class="img-responsive col-xs-12" />
        </div>
    </div>
</nav
    

Answer 1

如果你使用的引导V4你应该知道，IMG响应变更为IMG流体和COL-XS-12改为COL-12你可以看到网站的文档qazxsw POI

Answer 2

Bootstrap V4.2 docs IMG响应变更为IMG流体

Answer 3

你有没有尝试删除填充左：200像素;从移动媒体查询也与位置：固定;浮动：右边是不是一个好的做法，并需要使用IMG流体代替IMG-响应。