资讯专栏INFORMATION COLUMN

css设置文字上下居中,一行文字居中,两行或多行文字同样居中

Joyven / 1544人阅读

原文链接 http://www.cnblogs.com/handsomeBoys/p/6567063.html

 

 

 

HTML:

 

居中文字

 

 

CSS:

.book-detail-store-item {
    width: 50px;
    height:50px;
    line-height: 25px;
    font-size: 12px;


}

/*flex垂直居中对齐*/
.align-center-vertical{
     display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/2323.html

相关文章

  • 行或者单行文本超出显示点点点,如果保证内容始终垂直居中

    摘要:我现在的需求是这样的,我目前实现了一个框,显示文字,超出两行显示,如果单行要保证垂直居中,我如果给容器使用则当文字内容过多的时候会不上下文字有截断现在效果如下只能显示两行,超出显示省略号解决方法垂直居中的我现在的需求是这样的,我目前实现了一个div框,显示文字,超出两行显示...,如果单行要保证垂直居中,我如果给容器使用display:flex;align-items:center;则当文字...

    sydMobile 评论0 收藏0
  • HTML+CSS基础课程-imooc-【更新完毕】

    摘要:包含后代选择器包含选择器,即加入空格用于选择指定标签元素下的后辈元素。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择,而子选择器是通过进行选择。 6-1 认识CSS样式 CSS全称为层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。使用CSS样式的一个好处是通过定义某个样式,可...

    Heier 评论0 收藏0
  • CSS进阶篇--div中的内容垂直居中的五种方法

    摘要:二内边距法另一种方法和行高法很相似,它同样适合一行或几行文字垂直居中,原理就是利用将内容垂直居中,比如这段代码的效果和法差不多。 一、行高(line-height)法 如果要垂直居中的只有一行或几个文字,那它的制作最为简单,只要让文字的行高和容器的高度相同即可,比如: p { height:30px; line-height:30px; width:100px; overflow:hi...

    fjcgreat 评论0 收藏0
  • CSS2:宽度与高度疑难点解析

    摘要:宽度与高度如果你的代码里经常出现和属性说明你对宽度与高度理解的不够深文档流翻译很烂应该为普通流或者常规流的高度字体高度与行高字和字之间是通过基线对齐的行高与默认行高是字体设计室写进去的不同字体行高不一样跟字体设计有关系字体的建议行高写在了 CSS2:宽度与高度 如果你的CSS代码里经常出现height和width属性,说明你对宽度与高度理解的不够深 1.文档流(Normal Flow)...

    raledong 评论0 收藏0
  • 深入理解css之line-height

    摘要:的应用大部分时候,我们设置,都是为了垂直居中对齐。然后我们给设置,这样我们就可以重置设置的,又因为保持了内联特性,因此我们可以设置以及产生,从而实现近似垂直居中对齐。 前言 行高,顾名思义是一行文字的高度,而从规范上来说则是两行文字基线之间的距离。行高是作用在每一个行框盒子(line-box)上的,而行框盒子则是由内联盒子组成,因此,行高与内联元素可以说是非常紧密,行高直接决定了内联元...

    miya 评论0 收藏0

发表评论

0条评论

Joyven

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<