box

英[bɒks] 美[bɑ:ks]

n.ボックス; 箱のような物体; ボックス; 哨兵室

vt. Put... into a box [box, box]

vt.& vi.Boxing

三人称単数: ボックス 複数形: ボックス 現在分詞: ボクシング 過去形: ボックス過去分詞: boxed

pack

英[pæk] 美[pæk]

n.Pack; グループ; (カード) のペア;グループ

vt.& vi. (詰める...); 詰める; 群衆; (集める) グループにする

##vt. 選択する; 押す; 運ぶ; 締める

vi. パックする; 一緒に絞る; 折りたたんで保管するのが簡単; 急いで離れる (オフと一緒に使用されることもあります)

三人称単数: パック 複数形: パック 現在分詞: 梱包 過去形: パック 過去分詞: パック

css ボックスパック属性 構文

関数: ボックスが子要素のサイズより大きい場合に、子要素を配置する場所を指定します。このプロパティは、水平ボックス内の水平位置と垂直ボックス内の垂直位置を指定します。

構文: box-pack: start|end|center|justify;

説明: start 法線方向のボックスの場合, 最初の子の左端が左側 (最後の子の後の残りのスペース)

に配置され、反対方向のボックスの場合は、最後の子の右端が右側に配置されます (最初の子要素の前には残りのスペースが配置されます)。通常の向きのボックスの場合、最後の子の右端は右側に配置されます (最初の子の前の残りのスペース)。逆の向きのボックスの場合、最初の子の左端が左側 (および最後の子の後の残りのスペース) に配置されます。 center は余分なスペースを均等に分割し、スペースの半分を最初の子要素の前に配置し、残りの半分を最後の子要素の後に配置します。 justify は、各子要素間の余分なスペースを分割します (最初の子の前後に余分なスペースはありません)。

注: 現在、box-pack 属性をサポートしているブラウザはありません。 Firefox は、代替の -moz-box-pack 属性をサポートしています。 Safari、Opera、および Chrome は、代替の -webkit-box-pack 属性をサポートしています。

css ボックスパック属性 例

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
width:350px;
height:100px;
border:1px solid black;
  
/* Firefox */
display:-moz-box;
-moz-box-pack:center;
-moz-box-align:center;

/* Safari, Chrome, and Opera */
display:-webkit-box;
-webkit-box-pack:center;
-webkit-box-align:center;
}
</style>
</head>
<body>

<div>
<p>我是居中对齐的。</p>
</div>

<p><b>注释:</b>IE 不支持 box-pack 和 box-align 属性。</p>

</body>
</html>

インスタンスの実行 »

[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します