clip CSS プロパティとは
トピック：絶対配置された要素のクリッピング領域を定義することができるただし、overflowプロパティがvisibleに設定されている場合は機能しない
プロパティ clip
実例 コード 1
サンプル コードを試す img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
プロパティ 定義と使用法
| デフォルト値・初期値 : | auto |
|---|
| 適用対象 : | 絶対位置指定された要素 |
|---|
| 継承 : | 不可 |
|---|
| メディア : | visual |
|---|
| 計算値 : | auto 指定されていれば auto、それ以外は 4 つの値をともなう矩形。矩形の場合、各値は auto 指定されていれば auto、それ以外では計算値 |
|---|
CSS Version | CSS2 ～ |
|---|
| アニメーションの種類 : | rectangle |
|---|
| JavaScript 構文 | object.style.clip="funWebref" |
|---|
| 正規順序 : | 形式文法で定義される一意のあいまいでない順序 |
|---|
| CSSの構文 | clip: auto | shape | initial | inherit; |
|---|
プロパティ値
| 値 | 説明 |
|---|
auto | クリッピングは適用されない 。これはデフォルトです |
shape | 要素をクリップする有効なシェイプ値は、 rect (top, right, bottom, left)です。上端と下端はボックスの上端からのオフセットを指定し、右端と左端はボックスの左端縁からのオフセットを指定する 上、右、下、左のいれかに長さの値は自動があります。負の長さは許される |
initial | このプロパティをデフォルト値に設定する |
inherit | 親要素からこのプロパティを継承する |
サポートするデスクトップ ブラウザ対応・互換性
| 機能 | Chrome | Firefox | Internet Explorer | Opera | Safari (WebKit) |
|---|
| 基本サポート | 1.0 | 1.0 (1.0) | 4.0
8.0：このバージョンで正確なカンマ式の構文をサポート | 7.0 | 1.0 (85) |
|
サポートするモバイル ブラウザ対応・互換性
| 機能 | Android | Firefox Mobile | IE Phone | Opera Mobile | Safari Mobile |
|---|
| 基本サポート | 不明 | 不明 | 不明 | 不明 | 不明 |
|---|
CSS clip | CSS プロパティ 値| 意味 使い方 実例 – WebRef