css代码:

        .img-box {
padding-bottom: 100%;
} .img-box img {
position: absolute;
top:;
bottom:;
left:;
right:;
width: 100%;
/* margin:auto; */
}

html标签:

<div class="img-box">
<img src="data:image/banner_1_nn.png" />
</div>

css设置图片百分比显示,最简洁的代码的更多相关文章

  1. css设置图片居中、居左、居右

      CreateTime--2017年12月8日14:25:09 Author:Marydon css设置图片居中.居左.居右 图片一般默认是居左显示的,如何更改它的水平位置呢? <div st ...

  2. vue打包后js和css、图片不显示,引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  3. CSS设置图片垂直居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

  4. CSS设置图片居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

  5. 用CSS控制图片大小显示的方法

    图片自动适应大小是一个非常常用的功能,在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制,我们可不可以用CSS控制图片使它自适应大小呢? 可以通过按比例缩小或者放大到某尺寸(自己指定), ...

  6. CSS实现图片圆角显示

    问题描述 在自定义博客园侧边栏公告时,想增加博客头像,但图片默认显示成是方形的,不是很好看,想着改成圆角显示会漂亮些 解决方案 增加css样式 border-radius:25px; 上面的像素值根据 ...

  7. div css背景图片不显示

    我们在写页面时,为了便于维护,css样式通常都是通过link外部导入html的,有时在css中写入背景图片时,此时背景图片的路径应该是相对css文件的.比如,此时的文件有index.html,css. ...

  8. css设置图片水平及垂直居中

    .box { /*非IE的主流浏览器识别的垂直居中的方法*/ display: table-cell; vertical-align:middle; /*设置水平居中*/ text-align:cen ...

  9. 关于HTML+CSS设置图片居中的方法

    有的时候我们会遇到这样一个问题,就是当我们按下F12进行使用firebug调试的时候,我们发现图像没有居中,页面底下有横向的滑动条出现,图片没能够居中,默认状态下只是紧靠在页面最左侧,而我们对图像缩小 ...

随机推荐

  1. Spark(五十三):Spark RPC初尝试使用

    基本用法主要掌握一点就行: master slave模式运用:driver 就是master,executor就是slave. 如果executor要想和driver交互必须拿到driver的Endp ...

  2. em,rem,px的区别,以及实现原理?

    px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.em是相对长度单位.相对于当前对象内文本的字体尺寸举个例子:比如说当前容器`font-size:16px;`则`1em`就 ...

  3. 平时常说的ThreadLocal,今天就彻底解决它

    前言 一.了解ThreadLocal的作用 二.ThreadLocal简单使用 三.ThreadLocal原理 3.1 ThreadLocal的存取过程 3.2 探究ThreadLocalMap对象 ...

  4. 在本地搭建hyperledger fabric 网络

    参考了官方文档,直接就可以了https://hyperledger-fabric.readthedocs.io/en/latest/build_network.html 很好用 ➜ ~ cd $GOP ...

  5. golang testing 无法获取覆盖率问题

    https://segmentfault.com/q/1010000021142202

  6. ArcGIS 要素类整体平移工具-arcgis/arcpy/模型构建器案例实习教程

    ArcGIS 要素类整体平移工具-arcgis/arcpy/模型构建器案例实习教程 联系方式:谢老师,135-4855_4328,xiexiaokui#qq.com 目的:对整个要素类,按指定偏移距离 ...

  7. PostgreSQL中的索引(一)

    引言 这一系列文章主要关注PostgreSQL中的索引. 可以从不同的角度考虑任何主题.我们将讨论那些使用DMBS的应用开发人员感兴趣的事项:有哪些可用的索引:为什么会有这么多不同的索引:以及如何使用 ...

  8. ISO/IEC 9899:2011 条款1——范围

    1. 范围 1.本国际标准指定了C编程语言的形式并建立了对用C编程语言进行编写程序的诠释.[注:国际标准的设计是用于提升在多种数据处理系统中的C程序的可移植性.其目的在于能够被实现者与程序员所使用.] ...

  9. [Kaggle] Online Notebooks

    前言 Let's go to https://www.kaggle.com/ Kaggle Notebook 有实践记录的案例. 一.线性拟合噪声数据 [Sklearn] Linear regress ...

  10. 【环境搭建与软件安装】How to install CUDNN or uninstall

    前言 CuDnn是用于深度学习的GPU加速库,安装好NVIDIA和CUDA之后,安装CuDnn就简单多了,可参考官方文档. 操作过程 1. 下载cuDnn. 需要在NVIDIA官网注册账号,登录之后下 ...