<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. python 中if __name__=="__main__"

    if __name__=="__main__":表示当执行运行文件为当前代码所在文件时,则会执行if__name__=="__main__":后的语句. 如果这 ...

  2. PHP核心编程--目录操作（包含文件操作）

    一.目录操作 1.    创建目录 创建目录mkdir(目录名称)  //返回值为布尔 一次性创建主目录及其子目录 判断是不是一个目录is_dir  //返回true,false 判断目录或文件是否存 ...

  3. 修正Thinkphp 3.2 分页Page类以支持URL路由

    http://www.thinkphp.cn/topic/22114.html 最终目的实现以http://www.fl900.com/product/lists/1-0-0-1.html这样的URL ...

  4. @codeforces - 932G@ Palindrome Partition

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个字符串 s,求有多少种方案可将其划分成偶数个段 \(p_ ...

  5. qbao

    # -*- coding: utf-8 -*- import Image, cStringIO, webbrowser, re, time, math import urllib, urllib2, ...

  6. JavaScript--缓动动画+轮播图

    上效果: 实现步骤: 最重要的是运动公式!!! <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

  7. scrapy 调用js

    依赖: PyExecJS 使用案例: from execjs import execjs text = response.xpath('//script/text()')[1].get() ctx = ...

  8. POJ - 1679_The Unique MST

    The Unique MST Time Limit: 1000MS Memory Limit: 10000K Description Given a connected undirected grap ...

  9. 利用IDEA构建springboot应用-Controller的使用

    Controller的使用 @Controller 处理http请求   @RestController  Spring4之后新加的注解,原来返回json需要@ResponseBody配合@Contr ...

  10. 如何在WPF控件上应用简单的褪色透明效果？

    原文 https://dailydotnettips.com/how-to-create-simple-faded-transparent-controls-in-wpf/ 使用OpacityMask ...