Css3 calc は単純な math_html/css_WEB-ITnose を使用して幅を計算します

Css3 calc は、単純な数学演算を使用して幅を計算できます

calc は、単語 Calculate の略語で、単純な数学演算を使用できる Css3 の新しい長さ単位関数です

-moz- を使用します。 Firefox の場合は calc() プライベート属性、

Chrome は -webkit-calc() プライベート属性を使用する必要があります、

IE9 はプレフィックスなしの標準の記述方法をネイティブにサポートしていますが、

Opera はまだサポートしていません。 「+」「-」「*」「/」四則演算が使用できます（「+」と「-」の 2 つの記号は前後にスペースが必要ですが、「*」と「/」記号は必要ありません）。

が使用可能 パーセンテージ、px、em、rem、

などの単位を組み合わせて計算できます

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

.content {

border:1px Solid #000 ; /* '+' '-'-'シンボルの左側と右側のシンボル* /

: CALC (100%-2px);シンボルの右側*/

width:calc(10em + 10px)

}

/*3列の等幅レイアウト*/

.content3 {

margin-left:2 0ピクセル

/ * 「+」「-」記号の左右にはスペースを追加します。「*」「/」記号の左右にはスペースを追加しないでください。 */

width:calc(100) %/3 - 20px);

}

/* n は 0 から始まります。乗数は、3*0、3*1、3*2 などのように、順番に 1 ずつ増加します。乗算後の子要素result*/

.content3:nth-child(3n){

margin-left:0

}

calc は、calculate という単語の略語で、単純な数学演算を使用できる CSS3 の新しい長さ単位関数です。

Firefox では -moz-calc() プライベート属性を使用する必要があり、

Chrome では、プライベート属性を使用する必要があります。 -webkit-calc() プライベート属性、

IE9 はプレフィックスなしの標準的な書き込みをネイティブにサポートします。

Opera は一時的にまだサポートされていません。

操作ルール

「+」「-」「*」「/」を使用できます。四則演算 (「+」、「-」は 2 つの記号の横にスペースが必要で、「*」、「/」記号は必要ありません)、 パーセンテージ、px、em、rem、などの単位を使用できます。

さまざまな単位を組み合わせて計算できます

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

.content {

, 、、、、、、、、、、、、、、、、、、、 .content2 {

/* '+' '-' 記号の左右にスペースを追加します*/

幅：calc（10em + 10px）; /3 - 20px);

/* n は 0 から始まり、3*0、3*1、3*2 など、順番に 1 ずつ増加する乗数です。乗算結果の後の子要素*/

.content3:nth-child(3n) {

margin-left:0 }