html纵向文本,html – 垂直对齐css圈中多行的文本 -凯发k8官方网

我创建了一个包含文本的圆圈,文本需要始终居中.很简单,我已经找到了很多例子,例如使用line-height在一行中使用单词.

我的问题是文本有时会包含一行,有时是两行,有时是三行,我无法让它工作.

有任何想法吗？

i’ve created a fiddle here with three examples.

html：

loremlorem ipsumlorem ipsum dolor

css：

.container{

position: relative;

width: 70px;

display: inline-block;

}

.splash {

border-radius: 50%;

-webkit-border-radius: 50%;

-moz-border-radius: 50%;

height: 70px;

width: 70px;

background: green;

color: white;

position: absolute;

overflow: hidden;

display: table-cell;

text-align: center;

vertical-align: middle;

transform: rotate(15deg);

-ms-transform: rotate(15deg);

-webkit-transform: rotate(15deg);

}

总结

以上是凯发k8官方网为你收集整理的html纵向文本,html – 垂直对齐css圈中多行的文本的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错，欢迎将凯发k8官方网推荐给好友。