在 bootstrap 和 HTML 中调整大小时停止图像碰撞

Question

我的计算机研究课程即将进行一项评估，该评估实际上是使用 HTML、BOOTSTRAP 和 CSS 创建一个响应式信息网站。我这样说是为了警告人们，我对 html 和 bootstrap 很不擅长，所以如果存在组织问题或只是糟糕的代码，那是因为我缺乏知识

基本上我的问题是当我调整大小时一些图像发生冲突。

我的老师说的大多数问题，比如把它放在 div 中、调整图像文件的大小而不是 html 等都不起作用

CSS代码

    body{

        background-image: url("https://lh3.googleusercontent.com/proxy/bH-E_bOZVvg8Tet9wNoSisRFjNCivlR-7GAY2Q6AWF4q4KU46sIgxUUGHjmb58JLVum7jviuNn40NJdWZkPVtBZOJMDrc2ORZP7mvj5f04k");

    }

    footer {

        padding: 10px 0;

        clear: both;

        text-align: center;

    }

    footer a {

        color: #00bcff:

    }

    ul {

        text-align: center;

        list-style-position: inside;

    }

    .container{

        margin: 4% auto:

        max-width: 200px;

    }

    ul

    {

    list-style-type: none;

    }

    .imgbox{

           max-width: 150px;

        display: inline-block;

        vertical-align: top;

        padding:0 10px;

    }

任何人都知道为什么

Answer 1

您的图像宽度现在固定为960尝试添加以下CSS：.carousel-item img {   max-width: 100%; }