CSSPositionTryRule: style プロパティ
Baseline
2026
Newly available
Since January 2026, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
style は CSSPositionTryRule インターフェイスの読み取り専用プロパティで、CSSPositionTryDescriptors オブジェクトが入ります。これは @position-try ルールの本体で利用可能な記述子を表します。
値
CSSPositionTryDescriptors オブジェクトです。
style プロパティ自体は、CSSPositionTryDescriptors オブジェクトを置き換えることができないという意味で読み取り専用ですが、style プロパティに直接代入することは可能です。これは、その cssText プロパティへの代入と同等です。同時に、その CSSPositionTryDescriptors オブジェクトを setProperty() や removeProperty() メソッドを用いて変更することもできます。
例
この CSS には、@position-try アットルールがあり、これには --custom-left という名前がついており、3 つの記述子があります。
css
@position-try --custom-bottom {
top: anchor(bottom);
min-width: 100px;
margin-top: 10px;
}
js
const myRules = document.styleSheets[0].cssRules;
const tryOption = myRules[0]; // CSSPositionTryRule
console.log(tryOption.style.top); // "anchor(bottom)"
console.log(tryOption.style["min-width"]); // "100px"
console.log(tryOption.style.positionArea); // ""。 position-area は指定されていない
仕様書
| Specification |
|---|
| CSS Anchor Positioning Module Level 1> # dom-csspositiontryrule-style> |