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. Java同步数据结构之LinkedBlockingDeque

    前言 前面介绍完了队列Queue/BlockingQueue的实现类,接下来介绍双端队列Deque/BlockingDeque的实现类之一LinkedBlockingDeque,它是一种基于链表的可选 ...

  2. 国内it论坛

    社区是聚集一类具有相同爱好或者相同行业的群体,IT技术社区就是聚集了IT行业内的技术人,在技术社区可以了解到行业的最新进展,学习最前沿的技术,认识有相同爱好的朋友,在一起学习和交流. 技术社区一般有三 ...

  3. python中的tcp示例详解

    python中的tcp示例详解  目录 TCP简介 TCP介绍 TCP特点 TCP与UDP的不同点 udp通信模型 tcp客户端 tcp服务器 tcp注意点   TCP简介   TCP介绍 TCP协议 ...

  4. zip炸弹

    故障系统有人提了zip炸弹的故障,了解了一些关于zip炸弹的常识. 42.zip 是很有名的zip炸弹.一个42KB的文件,解压完其实是个4.5PB的“炸弹”. 更有甚者,一个叫做 droste.zi ...

  5. seaborn可视化

    文章来自https://blog.csdn.net/qq_33120943/article/details/76569756 详细教程可以查看官方额示例:http://seaborn.pydata.o ...

  6. （4）Linux命令分类汇总（13~16）

    Linux命令分类汇总(13~16) (十三)系统管理与性能监视命令(9个) 79       chkconfig 管理Linux系统开机启动项. 80       vmstat 虚拟内存统计. 81 ...

  7. appium(屏幕滑动)

    class handleswipe(): """ 屏幕滑动操作 """ def __init__(self, driver, functio ...

  8. CImage 和 CvvImage 命名空间问题

    [问题:名称CImage同时在两个库中出现] 1.出现: ATL #include <atlimage.h> OpenCv #include <highgui.h> #defi ...

  9. 冲刺Noip2017模拟赛1 解题报告——五十岚芒果酱

    题1 国际象棋(chess) [问题描述] 有N个人要参加国际象棋比赛,该比赛要进行K场对弈.每个人最多参加2场对弈,最少参加0场对弈.每个人都有一个与其他人都不相同的等级(用一个正整数来表示).在对 ...

  10. Springboot 使用Jwt token失效时接口无响应（乌龙）

    问题背景:新项目使用Springboot框架,鉴权使用了Jwt 处理cors: @Configuration public class WebMvcConfig implements WebMvcCo ...