<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
hr {
width: 33.33%;
height: 1px;
margin: 0;
background-color: #6495ED;
display: inline-block;  // hr是块级元素
vertical-align: middle;
}

span {
color: #000;
}
</style>
</head>

<body>
<div class="box">
<hr />
<span>文字居中显示</span>
<hr />
</div>
</body>

</html>

横线和文字一排，文字居中显示vertical-align: middle;的更多相关文章

  1. QT使用painter绘制文字时的居中显示

    在窗体上绘制文字时,在paintEvent()方法里用QPainter进行绘制. 主要获取对字符串打印在屏幕上时占用的像素大小 QPainter p(this); QFont font("宋 ...

  2. 用<center/>标签实现markdown 图片文字等内容居中显示

    markdown中,文字居中的方式是借助了html标签<center></center>的支持 示例 ![](https://img2018.cnblogs.com/blog/ ...

  3. Android 一排按钮居中显示

    将一排按钮放在LinearLayout中,设置LinearLayout的Android gravity属性为center_vertical(垂直居中)

  4. 浏览器兼容CSS代码：按钮文字垂直居中(input button text vertical align)

    经过测试的浏览器:IE6, IE7, IE8, IE9, Firefox, Chrome, Safiri, Maxthon 按钮的HTML代码: <input id="btn_comm ...

  5. [Android]Android 布局中如何让图片和文字居中显示？

    图片文字居中显示 **①组件TextView的属性 drawableTop ``` <LinearLayout android:layout_width="match_parent&q ...

  6. 如何利用CSS代码使图片和文字在同一行显示且对齐

    对于初学css的新手朋友来说,经常会遇到这样一个问题,当文字和图片出现在同一行或者同一个div里面的时候,在浏览器中运行出来的显示效果往往是在不同的行,那么,我们怎么才能利用CSS代码使图片和文字在同 ...

  7. Html、Css-----当有文字和图片的时候，需要文字和图片居中，怎么实现？不想文字换行怎么设置

    1 当有文字和图片的时候,需要文字和图片居中,怎么实现? <a href=#" target="aa" style="white-space:nowrap ...

  8. [转]div 让文字或图片居中

    本文转自:http://qsfwy.iteye.com/blog/250206 在div 中让 文字或图片居中,请参考以下代码1: - - - - - - - - - - - - - - - - - ...

  9. 微信小程序之canvas 文字断行和省略号显示

    文字的多行处理在dom元素中很好办.但是canvas中没有提供方法,只有通过截取指定字符串来达到目的. 那么下面就介绍我自己处理的办法: wxml: <canvas canvas-id='wor ...

随机推荐

  1. MaxCompute在高德大数据上的应用

    2019年1月18日,由阿里巴巴 MaxCompute开发者社区和阿里云栖社区联合主办的“阿里云栖开发者沙龙大数据技术专场”走近北京联合大学,本次技术沙龙上,高德数据技术专家苗翌辰为大家分享了高德如何 ...

  2. React Fiber 数据结构揭秘

    此章节会通过两个 demo 来展示 Stack Reconciler 以及 Fiber Reconciler 的数据结构. 个人博客 首先用代码表示上图节点间的关系.比如 a1 节点下有 b1.b2. ...

  3. Qt显示Linux desktop natification气泡提示框

    在现代Linux桌面环境上我们时常可以看到类似的消息框: 这些消息框常用在如下场景: 即时聊天软件的新消息 闹钟定时提示 电池电量提示 邮件消息 长耗时操作的完成提示 在freedesktop.org ...

  4. ----Juquery复选框全选反选及获取选中值Value

    --获取选中值 var pList = ""; $("[name='ckdProd']").each(function () { if ($(this).is( ...

  5. Spring webflux

    Spring-webflux Spring 5.0 Spring-webflux 是一个全新的非堵塞的函数式 Reactive Web 框架,可以用来构建异步的.非堵塞的.事件驱动的服务. sprin ...

  6. 牛客网：Java重命名文件

    项目介绍 不管是C/C++还是JAVA,都可能生成一些持久性数据,我们可以将数据存储在文件或数据库中,此项目主要训练学习Java对本地磁盘的文件重命名,例如C:\nowcoder.txt重命名C:\n ...

  7. Java新知识系列 七

    抽象类和接口的区别和特点 java的JDK中包含的五个工具 编译型语言和解释型语言 Java和C++的区别` 常见的ASCII的值 Forward和Redirect之间的对比 Web Service ...

  8. mac /linux vi/vim永久显示行号开启高亮模式

    临时显示:进入vi编辑器,输入命令 :set number     //下次在进入vi 无法显示行号 :set nonumber  //本次vi关闭行号显示 vi 每次修改后推荐使用命令: sourc ...

  9. 智能POS如何获取日志&数据库文件

    使用Teamviewer连接安卓机器,文件传输 ================================================================== 智能POS查看数据 ...

  10. git执行cherry-pick时修改提交信息

    git执行cherry-pick时修改提交信息 在本地分支执行cherry-pick命令时有时需要修改commit message信息,可以加参数-e实现: git cherry-pick -e co ...