使用CSS的圆圈中的文本段落

Nem*_*nja 24 html css geometry text paragraph

我一直在寻找一个体面和快速的解决方案,如何在圆圈内放置一段文字.我发现有两种解决方案.

解决方案1

浮动与文本左侧和文本右侧文本相同高度的多个div,并通过更改divs 宽度来调整文本剩余的空间.

解决方案2

使用生成器来做同样的事情,http://www.csstextwrap.com/index.php.

奖金(不是问题的一部分,只是提示)

我不是在寻找这个,但也许有人可能会需要它,我觉得把它作为一个链接很好> http://csswarp.eleqtriq.com/它是一个基于网络的生成器,可以帮助你将文字环绕在圆圈上.

问题?

是否有一个更简单的解决方案,将文本段落放在一个圆圈内,而不必添加浮动div和额外的标记.拍摄包含该文本的图像不是解决方案.最好的情况是,该解决方案将具有干净的HTML标记,在CSS中几乎没有调整.

Mar*_*det 23

Eric Meyer的书"Eric Meyer on CSS"谈到了这个(Project 10),你发现的文本包装解决方案使用相同的原理.

使用简单border-radius: 50%不会影响内容框的形状,此时内容框为矩形.例如,请参阅Kyle Sevenoaks 的演示.

正在开发的CSS3模块解决了这个问题:

http://dev.w3.org/csswg/css-shapes

但是,此规范仍处于草稿模式,目前尚未支持,可能需要一年或两年.

简短的回答是否定的,但希望这些评论能提供一些见解.