Re: CSS Text Layout Moduleで定義された論理的プロパティとDOMで取得できるスタイル情報との関係について教えてください。

Miwako Ichijo <usa132006@gmail.com> wrote on 2010/05/07 18:04:50
> 一條です。
> 
> CSS Text Layout
> Moduleで定義された論理プロパティ（margin-beforeやlogical-widthなど）をJavascriptで扱う時、
> 以下の場合にどうなるのか、ご存知の方は教えてください。
> 
> 1)　style属性に設定された場合、style.XXXXXXXで同じように取得できるのでしょうか。
> 2)　getComputedStyle（IEだと今はcurrentStyleでしたか）でスタイルの値取得する場合はどうなるのでしょうか。

> 例ではmarginを出しましたが、一番気になるのはwidthとheightです。
> スクリプト処理で扱うことが多いプロパティはこの2つではないかと考えています。
> 
> どのあたりの仕様を読めばいいのか、分からなくなりまして投稿いたしました。
> よろしくお願いします。


CSS3 Text Layout の論理プロパティは、やっと Editor's Draft に入れる
ことができた段階なので、それが DOM でどのように扱われるかという仕様は
まだ書かれていません。ただし、CSS3 Text Layout の次の記述から、
仕様の意図を汲みとってもらえたらと思います：
（http://dev.w3.org/csswg/css3-text-layout/#logical-prop より）

The computed value of a logical property affects the computed value of
the corresponding physical property, and vice versa.
（論理プロパティの算出値は、対応する物理プロパティの算出値に影響を及ぼす。
また逆も成り立つ）

For example, if the writing-mode of the element is lr-tb, the computed
value of the ‘margin-before’ overrides the ‘margin-top’.
（例えば、writing-mode が lr-tb の場合、margin-before の算出値は 
margin-top の値を上書きする）

If both logical and physical properties are specified on the same
element, these corresponding properties are treated as same property and
then normal cascading rules are applied.
（もし論理プロパティと物理プロパティの両方が同じ要素に指定されていたら、
それらの対応するプロパティどうしは同じプロパティとした扱われた上で、通常
のカスケーディング規則が適用される）

つまり、この仕様としては、対応する論理プロパティと物理プロパティは、
結果として同じ算出値になるということが求められています。


ブラウザで、Mozilla と WebKit は、以前からベンダー拡張として 
margin-start や margin-end が実装されています
（before/after は無くて、start/end のみ。
縦書きではなくて、direction: rtl のためなので）。

使用例：
    <style>
      p {
        -webkit-margin-start: 3cm;
        -moz-margin-start: 3cm;
        margin-start: 3cm;
      }
    </style>
    <p dir="ltr">LTR!</p>
    <p dir="rtl">RTL!</p>
    <p style="direction: rtl">RTL!</p>

Mozilla と WebKit では、DOM のプロパティ（MozMarginStart、
webkitMarginStart など）としても定義されていますので、よろしければ
実験してみてください。

次のところを参照：
http://help.dottoro.com/ljqbjiaw.php
http://help.dottoro.com/lcqbjiaw.php
https://developer.mozilla.org/En/CSS:-moz-margin-start
http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266--webkit-margin-start

-- 
村上 真雄 (MURAKAMI Shinyu)
http://twitter.com/MurakamiShinyu
Antenna House Formatter:
http://www.antenna.co.jp/AHF/
http://www.antennahouse.com

Received on Friday, 7 May 2010 11:58:56 UTC