简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
가변 개수의 열에 대한 너비를 알 수 없음
P粉441076405
P粉441076405 2023-08-20 21:40:19
0
1
587
<p>일부 항목을 열로 정렬하고 싶습니다. 항목의 너비나 높이, 컨테이너의 너비나 높이를 예측할 수 없습니다. 또한 얼마나 많은 열이 들어갈지, 열의 너비는 어느 정도가 되어야 할지 예측할 수 없습니다. 나는 브라우저가 컨테이너의 높이를 최소화하면서 컨테이너의 너비를 초과하지 않고 최대 열 수로 항목을 정렬하기를 원합니다. </p> <p>이렇게 하면 문제가 해결되었지만 더 좋은 방법이 있을까요? jQuery를 사용하지 않고도 이를 달성할 수 있나요? 이전 브라우저에서 올바르게 표시되도록(열 대신 행으로 배열하여) 수행할 수 있습니까? </p> <pre class="brush:php;toolbar:false;"><style> #래퍼 { column-width: 100px; /* jQuery는 이 값을 변경합니다 */ 패딩: 20px; 테두리: 2px 단색 파란색; } .안건 { 패딩: 50px; 테두리: 2px 단색 녹색; } </스타일> <div id="래퍼"> <div class="item">1</div> <div class="item">2</div> <div class="item">3</div> <div class="item">4</div> <div class="item">5</div> <div class="item">6</div> <div class="item">7</div> <div class="item">8</div> <div class="item">9</div> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <스크립트> // 하위 요소의 최대 너비를 가져옵니다. var maxWidth = 0; jQuery('#wrapper .item').each(function() { var 너비 = jQuery(this).outerWidth(true); if (너비 > 최대 너비) { 최대폭 = 너비; } }); // 래퍼의 열 너비를 최대 너비로 설정합니다. jQuery('#wrapper').css('열 너비', maxWidth + 'px'); <p><br /></p>
P粉441076405
P粉441076405

모든 응답(1)
P粉865900994
P粉8659009942023-08-21 15:16:35 1층

그리드를 사용하여 이를 달성할 수 있습니다

으아아아
좋다 +0
답글 추가
인기 주제
더>
인기 기사
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！