如何实现左右两边有小竖线，但是高度比中间的字短？

用line-height，把line-height设置得跟height一样大，同时把font-size设置比line-height大即可

line-height的更多相关文章

  1. How to Take Control of Your Line Height in Outlook.com

    Reference to: http://www.emailonacid.com/blog/details/C13/line_height_and_outlook.com

  2. 深入了解css的行高Line Height属性

    什么是行间距? 古时候我们使用印刷机来出来文字.印刷出来的每个字,都位于独立的一个块中. 行间距,即传说中控制两行文字垂直距离的东东.在CSS中,line-height被用来控制行与行之间垂直距离. ...

  3. height与line-height

    1.网页的所有元素可以分为块元素和行元素.一行文字所在的一个逻辑区域是行元素,其他的元素就都是块元素line-height只针对行元素,height针对其他所有元素 2. width,height对于 ...

  4. 真正的能理解CSS中的line-height，height与line-height

    https://blog.csdn.net/a2013126370/article/details/82786681 在最近的项目中,常常用到line-height,只是简单的理解为行高但并没有深层次 ...

  5. CSS3与页面布局学习总结（二）——Box Model、边距折叠、内联与块标签、CSSReset

    一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

  6. CSS学习笔记——视觉格式化模型 visual formatting model

    CSS 视觉格式化模型(visual formatting model)是用来处理文档并将它显示在视觉媒体上的机制.他有一套既定的规则(也就是W3C规范),规定了浏览器该怎么处理每一个盒子.以下内容翻 ...

  7. 微信小程序demo2

    接着上篇 微信小程序-阅读小程序demo写:http://www.cnblogs.com/muyixiaoguang/p/5917986.html 首页banner动画实现 京东新闻上下动画实现   ...

  8. 模仿东京首页banner轮播，京东新闻上下滚动动画实现（动画实现）

    接着上篇 微信小程序-阅读小程序demo写:http://www.cnblogs.com/muyixiaoguang/p/5917986.html 首页banner动画实现 京东新闻上下动画实现 想着 ...

  9. 想着模仿京东微信首页呢，banner滚动搞定了，写到了一半了

    接着上篇 微信小程序-阅读小程序demo写:http://www.cnblogs.com/muyixiaoguang/p/5917986.html 想着模仿京东首页呢,结果也没赶得及写完,轮播图让我搞 ...

  10. 浅析CSS中的BFC和IFC

    1. 为什么会有BFC和IFC 首先要先了解两个概念:Box和formatting context: Box:CSS渲染的时候是以Box作为渲染的基本单位.Box的类型由元素的类型和display属性 ...

随机推荐

  1. 《Office 365开发入门指南》上市说明和读者服务

    写在最开始的话 拙作<Office 365开发入门指南>上周开始已经正式在各大书店.在线商城上市,欢迎对Office 365的开发.生态感兴趣的开发者.项目经理.产品经理参考本书,全面了解 ...

  2. 最长滑道问题（非递归，C++）

    这是爱奇艺的一道算法题. 题目描述请参考博客http://blog.csdn.net/sinat_30186009/article/details/52356053,在此表示感谢. 基本思路参考了以上 ...

  3. 【Java每日一题】20170228

    20170227问题解析请点击今日问题下方的“[Java每日一题]20170228”查看(问题解析在公众号首发,公众号ID:weknow619) package Feb2017; import jav ...

  4. Java学习笔记之——Object类

    所有类的祖先 如果一个类没有显式继承,则继承Object 每一个类都直接或间接的是Object的子类 相关API: protected Objectclone() 创建并返回此对象的副本. boole ...

  5. Exception in thread "main" java.lang.NoClassDefFoundError: org/apache/hadoop/fs/CanUnbuffer

    在执行spark on hive 的时候在  sql.show()处报错 : Exception in thread "main" java.lang.NoClassDefFoun ...

  6. ES6之Object.assign()详解

    译者按: 这篇博客将介绍ES6新增的Object.assign()方法. 原文: ECMAScript 6: merging objects via Object.assign() 译者: Funde ...

  7. PHP Warning: PHP Startup: redis: Unable to initialize module Windows版本phpredis扩展

    版权声明:经验之谈,不知能否换包辣条,另,转载请注明出处.https://www.cnblogs.com/zmdComeOn/category/1295248.html [root@VM_0_2_ce ...

  8. JS与CSS阻止元素被选中及清除选中的方法总结

    有时候,我们希望阻止用户选中我们指定区域的文字或内容. 举个栗子,有时候用户在一个区域执行频繁的点击操作,一不小心傲娇地点多了,就会选中当前区域的内容. 再举个栗子,制作轮播组件的时候,点击下一页,若 ...

  9. AI在汽车中的应用：实用深度学习

    https://mp.weixin.qq.com/s/NIza8E5clC18eMF_4GMwDw 深度学习的“深度”层面源于输入层和输出层之间实现的隐含层数目,隐含层利用数学方法处理(筛选/卷积)各 ...

  10. Mysql sql 功能分类

    分类 DDL:数据定义语言,用于定义数据库对象,比如创建表,列,库等 DML:数据操作语言,用于添加.删除.修改数据 DQL:数据查询语言,用于查询(结果集是虚拟表,放在内存中) DCL:数据控制语言 ...