2

我想像在图像周围环绕文本一样“包裹”文本，但是没有图像可以做到这一点吗？

右边的文字是我想要的结果。 在此处输入图像描述

4

4 回答 4

1

您可以使用 CSS3 转换。

jsFiddle 示例

div {
    position:relative;
    width:300px;
    left: 40px;
    transform: skew(-20deg);
   -ms-transform: skew(-20deg); /* IE 9 */
   -moz-transform: skew(-20deg); /* Firefox */
   -webkit-transform: skew(-20deg); /* Safari and Chrome */
   -o-transform: skew(-20deg); /* Opera */
}​
于 2012-10-16T15:54:14.303 回答
0

这是可能的，但它不能用漂亮的标记来完成。

看看http://www.torylawson.com/index.php?title=CSS_-_Wrapping_text_around_non-rectangular_shapes

http://www.csstextwrap.com/ - 是一个在线工具，如果您想要“复制和粘贴”方法，它可能会有所帮助。

http://www.jwf.us/projects/jQSlickWrap - 如果不要求 IE 支持，它是一个用于非 ie 浏览器的 jquery 插件。

于 2012-10-16T15:51:09.183 回答
0

我设法编写了自己的小脚本。这个想法来自 jQSlickWrap，每行都有一个元素。

它是：http: //jsfiddle.net/m4jLt/1/ 它还不完美，但经过一些调整，我认为它会工作得很好。那个小提琴有三个版本。（只是让你知道）

如果你做得更好，请分享:)

于 2012-10-17T08:14:53.560 回答
0

在现代浏览器中，您可以使用转换，但这也会扭曲内容（字母）。例子：

http://jsfiddle.net/willemvb/LftMA/

于 2012-10-16T15:53:43.470 回答