vertical-align 垂直对齐  (对于块级元素无效,主要用来控制表单或者图片与文字对齐的)
图片和文字默认是基线对齐
属性: baseline 基线
top 顶线
middle 中线
bottom 底线 vertical-align 另一个作用 去除文字底侧空白缝隙
有一个特性:图片或者表单等行内块元素,他的底线和父级盒子的基线对齐,装图片底层会有一个空白缝隙
解决方法1:display: block;
解决方法2: vertical-align: top

行内块和文字垂直对齐vertical-agign的更多相关文章

  1. CSS基础 行内元素/行内块元素设置垂直对齐方式及常见使用案例

    vertical-align 属性值 效果 baseline 基线对齐 top 顶部对齐 middle 中心对齐 bottom 底部对齐 使用案例1:百度搜索框左边和右边底部没有对齐 使用vertic ...

  2. 【css对齐】块内或者行内图片与文字居中对齐最靠谱的方式!

    块内或者行内图片与文字居中对齐最靠谱的方式! 做图片与文字在一行的按钮时候最常用到,总结了一个靠谱的方法,终于可以完美的对齐下面给个代码 首先是html: <p class="btnU ...

  3. line-height系列(二)——对行内元素(文字、图片、兄弟元素)、块级元素设置line-height后的表现

    >原创文章,转载请注明来源! 二.对行内元素(文字.图片.兄弟元素).块级元素设置line-height后的表现 对块级元素无效,对行内元素有效.可继承给行内元素. 文字的line-height ...

  4. 疑问:line-height对非文字行内块的影响

    line-height:对子元素是非文字的行内块,表现出来的不是垂直居中.目前还不知道具体细节. 可以看出来两个东西不在一行.老师的解释是line-height对非文字元素解释不一样,但是我没懂细节. ...

  5. 前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位

    前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位 一丶css选择器的优先级 行内 > id选择器 > 类选择器 ...

  6. CSS.02 -- 样式表 及标签分类(块、行、行内块元素)、CSS三大特性、背景属性

    样式表书写位置  内嵌式写法 <head> <style type="text/css"> 样式表写法 </style> </head&g ...

  7. 【HTML】行内-块级-行块级

    行内元素 相邻元素可以在一行显示直到一行排不下才进行换行. 不可设置宽高,宽度随内容变化. padding和margin的设置中,水平方向(padding-left...)有效果,垂直方向无效果. 块 ...

  8. CSS(3)---块级标签、行内标签、行内块标签

    块级标签.行内标签.行内块标签 html中的标签元素三种类型:块级标签.行内标签.行内块标签. 一.概述 1.块级标签 概念 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属 ...

  9. HTML 行内-块级-行块级

    行内元素 相邻元素可以在一行显示直到一行排不下才进行换行. 不可设置宽高.对齐等属性,宽度随内容变化. padding和margin的设置中,水平方向(padding-left...)有效果,垂直方向 ...

随机推荐

  1. 交叉编译多平台 FFmpeg 库并提取视频帧(转)

    交叉编译多平台 FFmpeg 库并提取视频帧 转  https://www.cnblogs.com/leviatan/p/11142579.html 本文档适用于 x86 平台编译 armeabi.a ...

  2. smarty 模板几个例子(变量调节器)

    一.assign和display方法的使用以及几个变量调节器 header("content-type:text/html;charset=utf-8");//加载Smarty引擎 ...

  3. CALL 'SYSTEM' ID 'COMMAND'

    CALL 'SYSTEM' ID 'COMMAND' 语句创建 AL11文件夹 , line(), END OF tabl. DATA: lt_string TYPE STANDARD TABLE O ...

  4. Python常用模块安装

    1. python操作MySQL数据库的依赖包MySQLdb ImportError: No module named MySQLdb 安装方式: yum install MySQL-python 2 ...

  5. jQuery.data() 即($.data())的实现方式

    jQuery.data() 的作用是为普通对象或 DOM Element 附加(及获取)数据.     下面将分三个部分分析其实现方式:     1. 用name和value为对象附加数据:即传入三个 ...

  6. springboot datajpa 简明说明

    findById返回Optional的使用 查询 public Object lookupDevice(Integer id) { return deviceJpa.findById(id).orEl ...

  7. 将raspberry 3B+的apt替换为国内源

    前段时间买了一块树莓派,想着自己拿来玩一下下(没什么钱烧更好的硬件,只能玩这个了,好在还够玩).于是就折腾起来,装了raspberry的系统. 这时候,因为默认apt是国外的源,在GFW这种神奇东西的 ...

  8. 【转贴】SMP、NUMA、MPP体系结构介绍

    SMP.NUMA.MPP体系结构介绍 https://www.cnblogs.com/tcicy/p/10185783.html 从系统架构来看,目前的商用服务器大体可以分为三类,即对称多处理器结构 ...

  9. XSSFWorkbook对象 进行zip打包时 用write资源流自动关闭处理办法

    XSSFWorkbook对象的write方法内会将传入的资源流自动关闭 导致下载excel失败 错误代码 OutputStream out = response.getOutputStream(); ...

  10. SQL语句中的HAVING关键字

    sql中的having语句是在使用group by的时候使用的. 通常where语句是在group by之前做数据筛选的,而having语句是对group by之后的结果进行筛选的. 例如: 从商品销 ...