相关疑难解决方法(0)

CSS - 如何从div溢出到屏幕的全宽

我有一个包含DIV,我用作响应网格的一部分.它扩展到允许的最大宽度1280px,然后大型设备出现边距.这是我的CSS +一点点.

.container
{
    margin-left:auto;
    margin-right:auto;
    max-width:1280px;
    padding:0 30px;
    width:100%;

    &:extend(.clearfix all);
}
Run Code Online (Sandbox Code Playgroud)

但是在某些情况下我想横向溢出 - 假设我有一个需要全宽的背景图像或颜色.我不擅长CSS - 但是有可能实现我想要的吗?

css

12
推荐指数
2
解决办法
2万
查看次数

左侧容器外溢出图像

请耐心等待,这有点难以正确解释......

在此输入图像描述

下面描述的第一部分工作正常.
在第一张图像上,您会看到一个比我的(引导程序)容器更宽的浏览器屏幕.蓝色是整个屏幕窗口,白色是容器(带有a max-width),带有来自bootstrap的基本12列.
我希望右边的笔记本电脑比它在自举网格上的x列更宽.当(例如)7个列的宽度为(例如)500px且图像宽度为800px时,它将自然地溢出容器(如果图像没有给出宽度,则为当前).因此,当您将窗口缩小时(请参见第二张图片),您只需剪切一下图像.

在此输入图像描述

下面描述的第二部分是问题......
现在我想在左侧有相同的东西...但是当我在我的自举中有7个柱子时,(例如)500px宽,我有一个其中的图像,宽度为800px,溢出自然发生在右侧.我希望这是在左侧!因此,在内部使用带有图像的div的内容与右侧对齐,但溢出位于左侧.

这就是现在正在发生的事情:溢出在右边(当它应该在左边).

在此输入图像描述

  • 我不想拉伸此图像的时间长于图像的自然宽度
  • 我喜欢它而<img>不是background-image,但如果这是不可能的,我可以接受.

这个JSFiddle中提供了一些代码

html css twitter-bootstrap

6
推荐指数
1
解决办法
2146
查看次数

标签 统计

css ×2

html ×1

twitter-bootstrap ×1