flex의 용도를 전면적으로 이해하다
1146 단어 flex
예: html 코드:
<div class="container">
<div class="box">
</div>
</div>
css 코드:
.container{
width:600px;
height:400px;
border:1px solid blue;
display: flex;
justify-content:center;
align-items:center;
}
.box{
width:200px;
height:100px;
border:1px red solid;
ps:이렇게 하면 수평 수직으로 가운데에 들어갈 수 있어요.2. flex의 속성
<div class="items">
<div class="item">1</div>
<div class="item">23</div>
<div class="item">4</div>
</div>
items에 쓸 수 있는 속성은 여섯 가지입니다.•flex-direction
•flex-wrap
•flex-flow
•justify-content
•align-items
•align-content
item에 쓸 수 있는 것은 6개입니다.
•order//이것은 item 단독으로 주는 것입니다. 그 item의 순서를 바꾸려면 이 속성을 그 item에게 주십시오
•flex-grow
•flex-shrink
•flex-basis
•flex
•align-self
다음은 flex의 용도에 대한 전면적인 이해를 위한 에피소드입니다. 많은 응원 부탁드립니다~
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
flex는 웹 서비스를 이용하여 사진을 업로드하여 코드를 실현한다WebService 엔드 코드 Flex 클라이언트 코드...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.