<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. 一次web请求发生的神奇故事

    网络时代来临的时候,一个食指的点击就能解决很多问题! 那么当你的食指点击的时候,都发生了哪些神奇的事情呢?下面从几个角度为你做一个指引 1. 网络角度:一次网络请求是如何实现的 2. 浏览器角度:He ...

  2. !important覆写css行内样式

    <div class="block"> <span style="font-weight: bold; color: red;">Hel ...

  3. 2019-10-18-dotnet-修复找不到-System.ServiceProcess-定义

    title author date CreateTime categories dotnet 修复找不到 System.ServiceProcess 定义 lindexi 2019-10-18 21: ...

  4. laravel后台扩展包

    https://github.com/the-control-group/voyager

  5. 【转载】【软件安装】Source Insight 4.0常用设置

    1.Source Insight简介 Source Insight是一个面向软件开发的代码编辑器和浏览器,它拥有内置的对C/C++, C#和Java等源码的分析,创建并动态维护符号数据库,并自动显示有 ...

  6. 【JZOJ4787】【NOIP2016提高A组模拟9.17】数格子

    题目描述 输入 输出 样例输入 1 10000 3 10000 5 10000 0 0 样例输出 1 11 95 数据范围 每个测试点数据组数不超过10组 解法 状态压缩动态规划. 设f[i][j]表 ...

  7. ACK容器服务虚拟节点使用阿里云日志服务来收集业务容器日志

    按照这篇博文的介绍,可以在ACK集群上通过Helm的方式部署虚拟节点,提升集群的弹性能力.现在,通过虚拟节点部署的ECI弹性容器实例也支持将stdout输出.日志文件同步到阿里云日志服务(SLS)进行 ...

  8. MacOS利用Terminal访问远程Linux服务器

    常用命令 默认22端口访问 ssh x.x.x.x 指定端口访问 ssh x.x.x.x -p port 指定用户访问(默认是MacOS当前用户) ssh user@x.x.x.x [-p port] ...

  9. 【JZOJ1611】Dining

    题目描述 农夫JOHN为牛们做了很好的食品,但是牛吃饭很挑食.每一头牛只喜欢吃一些食品和饮料而别的一概不吃.虽然他不一定能把所有牛喂饱,他还是想让尽可能多的牛吃到他们喜欢的食品和饮料. 农夫JOHN做 ...

  10. 【IOS】异常捕获 拒绝闪退 让应用从容的崩溃 UncaughtExceptionHandler

    尽管大家都不愿意看到程序崩溃,但可能崩溃是每一个应用必须面对的现实.既然崩溃已经发生.无法阻挡了.那我们就让它崩也崩得淡定点吧. IOS SDK中提供了一个现成的函数 NSSetUncaughtExc ...