单独一个img标签的居中显示

针对页面当中通过img插入图片的时候，要保证这个图片在页面内容当中居中，一般的做法是在外面套一个div，通过给div加入 {margin:0 auto;} 来控制图片的居中。
那么如果针对后台上传的图片这样做就不行了，所以这里介绍一种做法是：
如下代码：

只要加上这个css样式就可以在父盒子里完全居中显示了！
img{ margin:0 auto; display:block;}
这样就可以解决单独图片居中的问题。

时间： 2024-10-05 11:59:48

单独一个img标签的居中显示的相关文章

JavaScript基础 window.open(url,name,options) 弹出一个新窗口屏幕居中显示获取屏幕的有效宽度

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=ut

怎样使一个div标签随着浏览器窗口的改变一直居中显示

在我们开发页面的过程中,经常会遇到让div居中在浏览器中显示,或使div标签在父级div中居中显示,下面就是解决方法1.在浏览器中居中显示 <style> .main{width:200px;height:200px;margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0;} </style> <div class="main"></div> 2.在父级

MFC 窗口居中显示 VS2010

MFC 窗口居中显示 VS2010 (2011-09-11 19:52:05) 转载▼ 标签: 窗口居中显示 it 分类: MFC MFC窗口居中显示 VS2010 工程名为:MFC22_6 目的:点击居中按钮,窗口将在文档的中央显示思路:使窗口居中显示可以调用CWnd::CenterWindow函数.void CenterWindow(CWnd* pAlternateOwner=NULL):步骤: 1. 用创建一个单文档应用程序 2. 添加一个对话框资源//(类视图右键—添

Android Hack1 使用weight属性实现视图的居中显示

本文地址:http://www.cnblogs.com/wuyudong/p/5898403.html,转载请注明源地址. 如果要实现如下图所示的将按钮居中显示,并且占据父视图的一半,无论屏幕是否旋转合用weightSum属性和layout_weight属性不同Android设备的尺寸往往是不同的.作为开发者,我们需要创建适用于不同尺寸屏幕的XML文件.硬编码是不可取的,因此需要其他方法来组织视图. 本文分析如何合用layout_weight和weightSum这两个属性来填充布局内部的任意

关于UIImageView的显示问题——居中显示或者截取图片的中间部分显示

我们都知道在ios中,每一个UIImageView都有他的frame大小,但是如果图片的大小和这个frame的大小不符合的时候会怎么样呢?在默认情况,图片会被压缩或者拉伸以填满整个区域. 通过查看UIView的属性可以知道,view的contentMode属性可以用来控制图片的显示情况.下面的设置可以让图片进行居中显示. 1 imageView.contentMode = UIViewContentModeCenter; 这个居中是包括了,横向和纵向都是居中.图片不会拉伸或者压缩,就是按照im

sublime标签页不能显示的解决方法

正在撸代码,突然发现sublime的标签页不能显示了.一般这种情况直接在菜单栏里找到一个“查看”,然后把所有的显示的项启用即可. 然而我这里并没有什么效果.依然不显示. 于是乎找度娘,按照一论坛里的方法,修改配置文件,才正常显示了标签页. 以下是步骤: 1.菜单栏“首选项” >>“浏览插件” ,向上一级,进入Data目录,进入Local目录 2.找到 Session.sublime_session 文件 3.关闭sublime,使用记事本打开Session.sublime_session ,搜

CSS如何让浮动导航栏元素居中显示

CSS如何让浮动导航栏元素居中显示:制作导航栏是最为基础的布局技能之一,当然对于稍有经验的人员来说没有任何问题,不过对于初学者可能会有一定的困扰.普通的导航栏一般具有一下几个特点,整个导航栏居中,导航栏目具有,并且能够均匀分布,下面就是一个这样的简单代码实例.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author"

关于大图片居中显示~适应移动端

今天修改项目的时候碰到一个问题,移动端点击小图片后,打开一个大图片显示:由于这个大图片的比例是不确定的,所以如何显示就成了一个问题. 最初的这个功能是设置了一个css3的属性,然后在Android手机上出了问题, -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; 然后我查了一下这个属性: 因为版本的原因,一些Android机没法使用这个属性. 我找了找居中显示的资料,看了看百度图片的图片显示方

让TextView的drawableLeft与文本一起居中显示

TextView的drawableLeft.drawableRight和drawableTop是一个常用.好用的属性,可以在文本的上下左右放置一个图片,而不使用更加复杂布局就能达到,我也常常喜欢用RadioButton的这几个属性实现很多效果,但是苦于不支持让drawbleLeft与文本一起居中,设置gravity为center也无济于事,终于有空研究了一下,这里与大家一起分享. 声明欢迎转载,请注明出处! 博客园:http://www.cnblogs.com/ 农民伯伯: http://w