图片文字混排的垂直居中、inline-block块元素和行内元素混排的垂直居中问题
图片、文字混排:
不管图片和文字的前后位置,都要给 图片 设置 vertical-algin,而不是谁在前面给谁设置。
此方法兼容IE7+ 和其它主流浏览器。IE7-没有测。
inline-block块元素、行内元素混排:
同图片和文字的混排,测试IE7+ 和其它主流浏览器。IE7-没有测。
两个行内元素:
设置vertical-algin并不会使元素在父元素中居中。
vertical-algin:
w3c:该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。
但是测试发现,混排是,只能设置给inline-block和img这种具有宽高特性的元素。
图片文字混排的垂直居中、inline-block块元素和行内元素混排的垂直居中问题的更多相关文章
- 块级元素和行内元素的区别 (block vs. inline)
块级元素 (display: block) 独占一行,多个block元素会各自新起一行.默认情况下,block元素的宽度会填满父元素的宽度. 可以设置width, height属性.但是,即使设置了w ...
- block与inline,inline和inline-block,块级和行内元素,行内替换和行内非替换元素
block:块级元素默认display属性为block:无论块内内容有多少,总是占满一行: inline:行内元素默认display属性为inline:只占据块内的内容的大小,不会占满一整行: inl ...
- CSS中的块级元素(block)与行内元素(inline)
css中有3种基本的定位机制:普通流(相对定位实际上看做普通流定位模型的一部分)浮动(float)绝对定位(固定定位是绝对定位的一种)所以在学习浮动之前,我们先要了解块级元素与内联元素(行内元素).块 ...
- 【css】主要的块状元素(block element)和内联元素(inline element行内元素)
内联元素:只在行内发生作用,设置宽高不起作用,不会影响文字内容,使其换行等.竖直方向和间距也不起作用 display可以强制转换行内元素和块状元素,还可以取消显示none 块元素(bloc ...
- display:inline与display:block——行内元素显示与块级元素显示
display:inline 的作用是设置对象做为行内元素显示,inline是内联对象的默认值(ps:内联对象就是不自动产生换行的元素,比如span) 而我们一般用的div是块级元素,默认displa ...
- line-height系列(二)——对行内元素(文字、图片、兄弟元素)、块级元素设置line-height后的表现
>原创文章,转载请注明来源! 二.对行内元素(文字.图片.兄弟元素).块级元素设置line-height后的表现 对块级元素无效,对行内元素有效.可继承给行内元素. 文字的line-height ...
- CSS设置行内元素和块级元素的水平居中、垂直居中
CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-heigh ...
- CSS 一些基础知识(优先级、行内元素的一些属性、font-size单位) 怎样不加载图片
CSS大小写不敏感 选择器优先级如下所示: 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式. 作为style属性写在元素内的样式 id选择器 类选择器 标签选择器 通配符选择 ...
- div和css:行内元素和块元素的水平和垂直居中
行内元素: 水平居中:text-align:center ul水平居中:加 display:table; margin:0 auto; 此元素会作为块级表格来显示(类似 <table>), ...
随机推荐
- Quartz 一个JOB 配置多个Trigger时注意的问题
public class SimpleExample { public void run() throws Exception { Logger log = LoggerFactory.getLogg ...
- TCPdump抓包命令详解
http://starsliao.blog.163.com/blog/static/89048201062333032563/ TCPdump抓包命令 tcpdump是一个用于截取网络分组,并输出分组 ...
- linu 把文件中的字母小写转换为大写,大写转换为小写awk toupper tolower
cat aa.txt|tr "[a-z]" "A-Z" [root@ob2 mytmp]# awk '{print toupper($0)}' aa2.txt ...
- EcmaScript对象克隆之谜
先谈谈深拷贝 如何在js中获得一个克隆对象,可以说是喜闻乐见的话题了.相信大家都了解引用类型与基本类型,也都知道有种叫做深拷贝的东西,传说深拷贝可以获得一个克隆对象!那么像我这样的萌新自然就去学习了一 ...
- 实现整数转化为字符串函数itoa()函数
函数原型: char *itoa( int value, char *string,int radix);原型说明:value:欲转换的数据.string:目标字符串的地址.radix:转换后的进制数 ...
- win7下hadoop编程eclipse的配置
本人hadoop初学,折腾第一个hadoop1.1.2花了好几天,让各位见笑了, WARN NativeCodeLoader:52 - Unable to load native-hadoop lib ...
- jQuery EasyUI教程之datagrid应用
一.利用jQuery EasyUI的DataGrid创建CRUD应用 对网页应用程序来说,正确采集和管理数据通常很有必要,DataGrid的CRUD功能允许我们创建页面来列表显示和编辑数据库记录.本教 ...
- BaaS后端即服务 - 概念篇
摘要: 什么是BaaS? BaaS(Backend as a Service)是一种新型的云服务,旨在为移动和Web应用提供后端云服务,包括云端数据/文件存储.账户管理.消息推送.社交媒体整合等.Ba ...
- c++ String 大小写转化
string toUpperString(string str) { transform(str.begin(), str.end(), str.begin(), (int (*)(int))toup ...
- Oracle 添加主键和索引
数据的主键和索引一般情况下都是必须的,特别是表有大量数据的时候,索引和主键更是必不可少,这样可以提供数据的查询效率: 一.创建表的同时创建主键约束 (1)无命名 create table studen ...