该方法甚至可以解决img内容居中的问题

套路:最外层div宽度为居中内容所占的宽度(通常是1170px),并且使其居中(margin:auto)

里层的div宽度为全屏(通常是1920px;)再margin-left:-368px   该值等于(1170-1920) / 2 = 375px ,然而实战的时候也会有偏差。所以不一定规定死。

原理暂时理不清。具体操作如下:

html:

<div class="my-slider-li-imgdiv">
<div class="my-slider-li-imgdiv-inner">
<img src="http://images.weicantimes.com/banner-1.jpg" alt="更智能的餐饮信息化管理系统,客户回流、高效推广、轻松管理、智慧运营" />
</div>
</div>

css:

.my-slider-li-imgdiv{         width:1170px;margin: auto;    }
.my-slider-li-imgdiv-inner{ width:1920px; margin-left: -368px; }

温故而知新 css + html 超级牛逼的居中策略的更多相关文章

  1. IntelliJ IDEA 15款 神级超级牛逼插件推荐(超赞,谁用谁知道)

    满满的都是干货  所有插件都是在 ctrl+alt+s 里的plugins 里进行搜索安装 1.CodeGlance 代码迷你缩放图插件 2. Codota 代码提示工具,扫描你的代码后,根据你的敲击 ...

  2. Animate.css 一款牛逼的css3动画库

    Animate.css是一款很牛逼的,跨浏览器的css3动画库,使用方法也很简单只要引入一个animate.min.css就可以了, 简单使用 1 首先引入 animate的 css 文件样式 cdn ...

  3. 发现XMind一个超级牛逼的功能

    本来想要自己手动建立下文件夹的结构图,一不小心发现了一个大惊喜. 比如想要看一下360Downloads文件夹下的文件结构,可以先创建一个名叫360Downloads的主节点,然后把其文件夹下的文件直 ...

  4. 关于HTML5,最牛逼的10本书!

    关于HTML5,最牛逼的10本书! 关于HTML5,最牛逼的10本书.rar HTML5+CSS3从入门到精通 李东博 著 推荐指数:★★★☆ 简介:本书通过基础知识+中小实例+综合案例的方式,讲述了 ...

  5. 不用 Notepad++,还有更牛逼的选择!

    来源:oschina.net/news/110987/no-notepad-plus-plus 这两天 Notepad++ 牛逼了,然后引发了大家的关注,具体事件内容请大家自行百度,其实作为文本编辑工 ...

  6. 为什么我会认为SAP是世界上最好用最牛逼的ERP系统,没有之一?

    为什么我认为SAP是世界上最好用最牛逼的ERP系统,没有之一?玩过QAD.Tiptop.用友等产品,深深觉得SAP是贵的有道理! 一套好的ERP系统,不仅能够最大程度承接适配企业的管理和业务流程,在技 ...

  7. 我喜欢ASP.NET的MVC因为它牛逼的9大理由(转载)

    我很早就关注ASP.NET的mvc的,因为最开始是学了Java的MVC,由于工作的原因一直在做.Net开发,最近的几个新项目我采用了MVC做了,我个一直都非常喜欢.Net的MVC.我们为什么使用MVC ...

  8. 最牛逼android上的图表库MpChart(三) 条形图

    最牛逼android上的图表库MpChart三 条形图 BarChart条形图介绍 BarChart条形图实例 BarChart效果 最牛逼android上的图表库MpChart(三) 条形图 最近工 ...

  9. 最牛逼android上的图表库MpChart(二) 折线图

    最牛逼android上的图表库MpChart二 折线图 MpChart折线图介绍 MpChart折线图实例 MpChart效果 最牛逼android上的图表库MpChart(二) 折线图 最近工作中, ...

随机推荐

  1. webkit 模拟点击 winform

    刚在园子里看到有博主将WebBowser控件替换为Chrome内核(),链接http://www.cnblogs.com/gdyblog/p/WebKitBrowser.html 于是我想既然实现了替 ...

  2. js打印对象数组信息

    function writeObj(obj){ var description = ""; for(var i in obj){ var property=obj[i]; desc ...

  3. 大数据系列-java用官方JDBC连接greenplum数据库

    这个其实非常简单,之所以要写此文是因为当前网上搜索到的文章都是使用PostgreSQL的驱动,没有找到使用greenplum官方驱动的案例,两者有什么区别呢? 一开始我也使用的是PostgreSQL的 ...

  4. C#调用win32 api 操作其它窗口

    实现以下功能: 找到窗体 找到控件(也叫子窗体) 获取内容 获取位置 设置 位置 内容 鼠标点击 示范 1. 找窗体 以操作系统自带的计算器为例 string clWindow = "Cal ...

  5. webpack

    webpack 通过一个主文件 .js ,webpack把这个文件所有的依赖文件,都处理打包成js文件 webpack 可以干嘛?1.执行打包 (把require()模块化整合成一个js文件给html ...

  6. configuration error-could not load file or assembly crystaldecisions.reportappserver.clientdoc

    IIS启动网站后报错: configuration error Could not load file or assembly 'crystaldecisions.reportappserver.cl ...

  7. resin实现域名访问

    1.修改resin.properties 2.修改hosts文件 3.添加一行记录 配置完后就可以通过test.com访问项目了.

  8. ListView 的优化

    listView 的宽高设为固定, 或match_parent,这样在加载布局是, 几面装下几个item 就首先加载几个 减少对象的创建 //减少对象的创建 if (convertView == nu ...

  9. url中的特殊字符问题

    在 使用url进行参数传递时,经常会传递一些中文名(或含有特殊字符)的参数或URL地址,在后台处理时会发生转换错误.在有些传递页面使用GB2312, 而在接收页面使用UTF8,这样接收到的参数就可能会 ...

  10. 如果做好测试PM【转载】

    本文来源于:https://yq.aliyun.com/articles/14578?spm=5176.100238.yqhn2.14.Lcie4Y   摘要今年整体带了几个项目.我本人不是专业的PM ...