div데스크톱 화면에는 가로 3 개가 있는데 , 모바일 화면에서는 전체 화면 너비를 세로로 정렬하고 싶습니다. 이를 위해 어떤 CSS를 추가해야합니까? 다음은 내 코드입니다. 미리 감사드립니다.
#demo1 {
float: left;
width: 50%;
}
#div1 {
float: left;
background: green;
width: 25%;
}
#div2 {
float: left;
width: 50%;
background: red;
}
#div3 {
float: right;
width: 25%;
background: blue;
}<div id="demo1">
<div id="div1">1</div>
<div id="div2">2</div>
<div id="div3">3</div>
</div>사용 display:flex및 @media쿼리
#demo1 {
width: 100%;
display:flex;
justify-content:space-between;
}
#div1 {
background: green;
width: 25%;
}
#div2 {
width: 50%;
background: red;
}
#div3 {
width: 25%;
background: blue;
}
@media (max-width:992px) {
#demo1 {
flex-direction:column;
}
#div1, #div2, #div3 {
width:100%;
}
}<div id="demo1">
<div id="div1">1</div>
<div id="div2">2</div>
<div id="div3">3</div>
</div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다