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

最近のブラウザでは、変換を使用できますが、これによりコンテンツ（文字）も歪められます。例：

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

于 2012-10-16T15:53:43.470 に答える
0

私はなんとか自分の小さなスクリプトを書くことができます。このアイデアは、各行に要素を持つjQSlickWrapから生まれました。

http://jsfiddle.net/m4jLt/1/ まだ完璧ではありませんが、少し調整すればうまくいくと思います。そのフィドルには3つのバージョンがあります。（ちょうどあなたが知っているので）

あなたがそれをより良くするならば、共有してください:)

于 2012-10-17T08:14:53.560 に答える