<div class='container' style='width:1200px;margin:0 auto;'>

　　<div style='width:200px;margin:0 auto;height:164px;'><img src='XXX'></div>

</div>

container外 新增一行满屏div   设置z-index: -1  并且调整位置

<div style="width: 100%;height: 164px;background-color: #e8e8e8;display: inline-block;position: relative;top: -674px;z-index: -1"></div>

css技巧 1200px居中容器中某个div增加横屏背景的更多相关文章

  1. 用纯 CSS 创作一个在容器中反弹的小球

    效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/jKVbyE 可交互视频教 ...

  2. 前端每日实战：46# 视频演示如何用纯 CSS 创作一个在容器中反弹的小球

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/jKVbyE 可交互视频教程 此视频 ...

  3. CSS技巧！像table一样布局div

    摘自:http://www.cnblogs.com/hnyei/archive/2011/09/19/2181442.html 许多网页设计师都喜欢,将两个或者多个容器等高的并排放置,并在里面展示每个 ...

  4. 46.纯 CSS 创作一个在容器中反弹的小球

    原文地址:https://segmentfault.com/a/1190000015221260 练习地址:https://scrimba.com/c/c3GEWmTb 感想: 原来animation ...

  5. css和jQuery ，字符串中重新定义单个字符样式背景

    <table class="tb2"> <tr><td class="td1">融资登记企业<span>985& ...

  6. css 如何使图片与文字在div中居中展示？

      1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...

  7. 高阶 CSS 技巧在复杂动效中的应用

    最近我在 CodePen 上看到了这样一个有意思的动画: 整个动画效果是在一个标签内,借助了 SVG PATH 实现.其核心在于对渐变(Gradient)的究极利用. 完整的代码你可以看看这里 -- ...

  8. CSS中设置DIV垂直居中的N种方法 兼容IE浏览器

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  9. 5种样式实现div容器中三图摆放实例对比说明

    代码地址如下:http://www.demodashi.com/demo/11593.html 效果演示: demo点查看效果 需求说明: 如下图所示为设计图,希望在图片上传无规则无规律的情况下实现设 ...

随机推荐

  1. Hdu 4751(2-SAT)

    题目链接 Divide Groups Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Other ...

  2. Hdu 1150

    Machine Schedule Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  3. 多线程 多进程 协程 Queue(爬虫代码)

    快速理解多进程与多线程以及协程的使用场合和特点 首先我们来了解下python中的进程,线程以及协程! 从计算机硬件角度: 计算机的核心是CPU,承担了所有的计算任务.一个CPU,在一个时间切片里只能运 ...

  4. Congratulation！顺利通过-2019年6月份的PMP考试

    祝贺邮件 证书

  5. input的表单验证(不断更新中~~)

    1 手机号验证 <input type="tel" id="phone" name="phone" placeholder=" ...

  6. 10分钟学会Python

    #1. 语法 Python中没有强制的语句终止字符,代码块是通过缩进来指示的.缩进表示一个代码块的开始,逆缩进则表示一个代码块的结束.一般用4个空格来表示缩进. 声明以冒号(:)字符结束,并且开启一个 ...

  7. python字符串函数总结

    字符串函数主要分为: 查找: strs = "this is a line of text for test" index1 = strs.find("is") ...

  8. 2018-11-21-WPF-解决-ViewBox--不显示线的问题

    title author date CreateTime categories WPF 解决 ViewBox 不显示线的问题 lindexi 2018-11-21 09:37:53 +0800 201 ...

  9. 跟我一起认识axure（三）

    交互设置,添加链接 点击预览

  10. AtCoder Beginner Contest 084 C - Special Trains

    Special Trains Problem Statement A railroad running from west to east in Atcoder Kingdom is now comp ...