2014-02-25 4 views
1

일치하는 미디어 쿼리 조건을 단일 정의로 결합하는 도구가 있는지 궁금합니다. CESS3mediaqueries.js와 결합 된 LESS를 사용합니다. 그러나 출력 스타일 시트가 중첩으로 인해 32 개 이상의 미디어 쿼리를 포함하므로 CSS3 형식으로 특히 유지 관리 할 수없는 코드가 생성되는 경우가 종종 있습니다.일치하는 미디어 쿼리를 결합 하시겠습니까?

나는 무언가를 발견했으나 그르unt에만 해당됩니다. https://www.npmjs.org/package/grunt-combine-media-queries

+0

일치하는 미디어 쿼리의 예를 제공해 주시겠습니까? – BoltClock

+0

\ @ 미디어 화면 및 (최대 너비 : 1024px) {// 여기에 몇 가지 CSS} 및 @media 화면 및 (최대 너비 : 1024px) {// 여기에 몇 가지 CSS}. 조건에 일치하지만, LESS는 이들에 대한 사전 처리를 수행하지 않으므로 필자가 작성한 모든 인라인 미디어 쿼리가 별도의 블록으로 컴파일되었으므로 조건이 일치하는 곳에서 이들을 결합하고 싶습니다. – user3293063

+0

[이 질문과 답변은 도움이 될 수 있습니다.] (http://stackoverflow.com/questions/13503862/media-query-grouping-instead-of-multiple-scattered-media-queries-that-match?rq=1). 사용자별로 그룹화하는 기술에 대해서만 설명합니다. 자동으로 아무 것도 없습니다. – ScottS

답변

1

LESS 팀은 여러 개의 일치하는 미디어 쿼리를 결합하는 것을 선택했습니다. 이 문제는 Github에서 읽을 수 있습니다 : https://github.com/less/less.ruby/issues/196

저는 규칙을 결합하기 위해 CSS 도구를 찾아야한다고 생각합니다. 레스 컴파일러는 가까운 장래에 지원하지 않을 것입니다.

당신이 발견 그런트 도구는 또한 미디어 쿼리를 결합하여 컴파일 된 CSS를 구문 분석 : https://github.com/buildingblocks/grunt-combine-media-queries/blob/master/tasks/combine_media_queries.js

이 덜 구축 그런트를 사용하는 것이 좋습니다.

관련 문제