css未知大小的图片居中
未知大小的图片在指定大小的div盒子中垂直水平居中:
无需要JS

<style>
.box {
/*垂直居中*/
display: table-cell;
vertical-align:middle; /*水平居中*/
text-align:center; /* IE */
*display: block;
*font-size: 175px;/*约为高度的0.873,200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/ width:200px;
height:200px;
border: 1px solid #eee;
}
.box img {
/*图片垂直居中*/
vertical-align:middle;
} </style>
<div class="box">
<img src="http://images.cnblogs.com/cnblogs_com/daysme/915489/o_logo_5.jpg" />
</div>
css未知大小的图片居中的更多相关文章
- !!!css如何让img图片居中?css的display属性实现图片居中(代码实例)
在我们开发前端页面的时候,为了让页面效果美观,会让图片呈现居中效果.那么css怎么让img图片居中显示呢?本篇文章给大家带来css如何让img图片居中?css的display属性实现图片居中(代码实例 ...
- 用CSS让网页背景图片居中的方法
网页背景居中的方法有很多种的.这里介绍一些用CSS让背景图片居中的方法. 让背景图片居中的第一个方法是用像素设定,很多都用这种,但是也是最麻烦的: <div style="width: ...
- CSS中让背景图片居中且不平铺
background:url(../images/logo.jpg) no-repeat center ;
- 单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中
单个未知大小图片在div里面垂直居中的方法...添加辅助元素挤一下位置达到居中 <div class="ServicesLiTopPic"> <i>&l ...
- css文字居中、图片居中、div居中解决方案
一.文字居中 若文字只有一行 <!--html代码--> <div class="box"> <p class="text"> ...
- 如何使用css来让图片居中不变形 微信小程序和web端适用
图片变形很多人祭奠出了妖魔鬼怪般的各种大法,比如使用jq来写,或者使用css表达式来写.今天我总结的是使用css3来写,唯一最大缺点就是对一些浏览器版本不够兼容.下面就是关于如何使用css来让图片居中 ...
- css图片居中,通过纯css实现图片居中的多种实现方法
在网页布局中,图文排版是我们常用的,那么经常会遇到如何让图片居中显示呢,这篇文章将总结常用css实现图片居中的方法总结: html结构: <div class="demo" ...
- 只用CSS实现容器内图片上下左右居中
一直以来,大家都知道,DIV容器内设置 text-align:center 即可让图片居中,但是DIV内默认的图片是上对齐,不会上下居中,如果想要实现这样的效果,JS判断是比较麻烦的,因为DIV容器内 ...
- CSS设置图片居中的方法
如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...
随机推荐
- python 基础 内置函数
内置参数 print(all([5,-1,5])) # 非0都是真 true print(all([0,-1,5])) # false print(any([1,0,5])) # 有一个数据为真,就为 ...
- WordPress已占全球网站平台18.9%的份额
Automattic创始人马特·穆伦维格(Matt Mullenweg)在旧金山的WordCamp会议上谈到了旗下博客平台WordPress的最新发展情况.WordPress平台已成为全球18.9%网 ...
- Linux Packages Search
网站 : https://www.pkgs.org/ https://centos.pkgs.org/
- Vue 数据绑定语法
数据绑定语法 Vue.js 的模板是基于 DOM 实现的.这意味着所有的 Vue.js 模板都是可解析的有效的 HTML,且通过一些特殊的特性做了增强.Vue 模板因而从根本上不同于基于字符串的模板, ...
- Hive的安装与配置
1.因为我使用MySQL做为Hive的元数据库,所以先安装MySQL. 参考:http://www.cnblogs.com/hunttown/p/5452205.html 登录命令:mysql -h主 ...
- python 多线程小练习
需求:有100个数据,启动5个线程,每个线程分20个数据,怎么把这20个数据分别传给每个线程. 1. 利用多线程实现 import threading nums = list(range(100)) ...
- linq判断一个枚举的Name是否存在
比如,枚举如下: [Serializable] public enum PayType : int { /// <summary> /// AAA /// </summary> ...
- 软件包管理:rpm命令管理-校验和文件提取
校验主要用于判断文件是否做了更改 修改标志: 会用-V,会看输出结果即可. 当有误操作,比如删了某一个文件,只需知道他属于哪一个rpm包,可用提取找回覆盖就行.并不把整个rpm包安装,而是提取其中的某 ...
- dedecms开启多站点
dedecms开启多站点后,填写域名才能正确的地址 if ( ! function_exists('GetFileUrl')) { function GetFileUrl($aid,$typeid,$ ...
- C# 拼接字符串的几种方式和性能
开发过程中常用到的拼接字符串的方法有三种: 1 简单 “+=” 拼接法 1 2 3 4 5 string str="a"; str+="c"+"d ...