w3-notes logo

cocochido

HTML/CSSリファレンス

shape-outsideプロパティ

inheritance
継承可
animation type
<basic-shape>型で指定された値。その指定がなければアニメーション不可。

説明

周囲のインラインコンテンツを回り込ませる形状を設定します。
関連項目

使用例

出力結果

構文
syntax help

shape-outside: none | [ <basic-shape> || <shape-box> ] | <image> ;
none
margin-boxを指定したのと同等です。
指定した任意の形状で回り込ませます。
指定した矩形領域で回り込ませます。
指定したイメージの矩形領域で回り込ませます。

ブラウザ対応状況

shape-outside
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: circle
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: gradient
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: image
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: inset
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: polygon
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
79
62
61-62
37
10.1
24
10.3
37
62
61-62
11
81
76
81
13.1
68
13.4
81
68
shape-outside: three: value: syntax
IE
Edge
Firefox
Chrome
Safari
Opera
iOS Safari
Chrome for Android
Firefox for Android
62-70
61-62
37-68
10.1
24-55
10.3
37-68
62
61-62
11
81
76
81
13.1
68
13.4
81
68
Support data for this feature provided by
 
サポート
 
部分サポート
 
非サポート
 
不明
最終更新日: 2021-02-24
© 2020 ここちい堂. All rights reserved.