3인칭 단수: 상자 복수형: 상자 현재 분사: boxing 과거 시제: boxed 과거 분사: boxed
flex
영어 [fleks] American [flɛks] v. 수축(근육); 힘을 나타냄n. [전기] 꽃줄 3인칭 단수: 굴곡 현재 분사: 굴곡 과거 분사: 굴곡
CSS 박스 플렉스 속성 통사론
기능: 상자의 하위 요소가 크기를 확장하거나 축소할 수 있는지 여부를 지정합니다.
구문: box-flex: value;
설명: value 확장 가능한 요소 행입니다. 유연성은 상대적입니다. 예를 들어 box-flex가 2인 하위 요소는 box-flex가 1인 하위 요소보다 두 배 더 유연합니다.
참고: 확장 가능한 요소는 상자가 축소되거나 확장됨에 따라 축약되거나 확대될 수 있습니다. 상자에 추가 공간이 있을 때마다 확장 가능한 요소가 확장되어 해당 공간을 채웁니다. 현재 box-flex 속성을 지원하는 브라우저는 없습니다. Firefox는 대체 -moz-box-flex 속성을 지원합니다. Safari, Opera 및 Chrome은 대체 -webkit-box-flex 속성을 지원합니다.
CSS 박스 플렉스 속성 예
<!DOCTYPE html> <html> <head> <style> div { display:-moz-box; /* Firefox */ display:-webkit-box; /* Safari and Chrome */ display:box; width:300px; border:1px solid black; } #p1 { -moz-box-flex:1.0; /* Firefox */ -webkit-box-flex:1.0; /* Safari and Chrome */ box-flex:1.0; border:1px solid red; } #p2 { -moz-box-flex:2.0; /* Firefox */ -webkit-box-flex:2.0; /* Safari and Chrome */ box-flex:2.0; border:1px solid blue; } </style> </head> <body> <div> <p id="p1">Hello</p> <p id="p2">php中文网</p> </div> <p><b>注释:</b>IE 不支持 box-flex 属性。</p> </body> </html>
인스턴스 실행 »
온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요