브라우저가 허용하는 최소 너비 이상을 줄이는 방법이 있습니까?

브라우저가 허용하는 최소 너비 이상을 줄이는 방법이 있습니까?

운영 체제: Windows 10
화면 해상도: 1366x768

Google Chrome브라우저의 너비를 더 작게 만들려고 노력하고 있지만 왼쪽과 Firefox오른쪽 아래의 이 양보다 더 많이 옆으로 당기는 것은 허용되지 않습니다 . 이 블록을 제거하고 그 이상을 줄일 수 있는 방법이 있습니까?

참고: 제 문제는 모니터의 화면 공간이므로 브라우저의 화면 공간을 조금 더 줄일 수 있어야 했습니다.

아이디어는 브라우저 사이의 검은 공간을 늘리고 최소값을 차단하지 않고 너비를 더 자유롭게 조정할 수 있도록 하는 것입니다.

여기에 이미지 설명을 입력하세요

답변1

JavaScript에서 조정 가능한 좁은 브라우저 창을 실행하면 Chrome과 Firefox 모두 축소된 창을 열 수 있습니다.

사용할 수 있는 HTML 페이지는 다음과 같습니다.

<a href="javascript:window.open('your_url_here', '','width=320,height=480')">Open!</a>

그러면 "Open!"이라는 링크가 포함된 간단한 페이지가 표시됩니다. 링크를 클릭하면 일반적인 브라우저 페이지보다 더 크게 크기를 조정할 수 있는 새 브라우저 창이 열립니다.

내 실험에서는 Firefox의 너비를 약 290픽셀로 줄이는 데 성공했습니다. Chrome 약 200픽셀로 줄였습니다.


Chrome의 또 다른 방법은 확장 프로그램을 사용하는 것입니다. OSX 리사이저.

확장 프로그램 아이콘을 클릭하면 176픽셀로 줄일 수 있는 조정 가능한 새 창에서 현재 페이지가 다시 열립니다.


Chrome의 또 다른 방법은 개발자 도구를 사용하여 오른쪽에 고정하는 것입니다.

도킹은 개발자 도구를 열고 3점 메뉴 아이콘을 클릭하여 수행됩니다.

여기에 이미지 설명을 입력하세요

개발자 도구가 오른쪽에 도킹되면 중간 구분선을 끌어 왼쪽에 표시되는 페이지의 크기를 조정할 수 있습니다.

이런 식으로 줄일 수 있었던 최소값은 150픽셀이었습니다.

답변2

스크린샷으로는 브라우저가 얼마나 작은지 알 수 없지만 다음과 같은 도구를 사용합니다.디스플레이퓨전이를 통해 울트라와이드 모니터를 몇 개의 가상 화면으로 분할할 수 있었습니다. 그런 다음 단축키를 누르고 Firefox를 작은 화면으로 옮기면 자동으로 크기가 조정됩니다. 나는 그것이 그것을 집어넣는 방법이라고 믿는다.

제가 사용하는 또 다른 도구는, 트리거되면 화면이 그리드로 표시되고 마우스를 움직여 필요한 화면 크기 조정 크기를 나타내는 상자를 그립니다. 이것으로 Firefox를 아주 작게 만들 수 있습니다.

아래 사진은 울트라와이드가 아닌 27인치 모니터에서 촬영한 것으로 Firefox 창이 얼마나 작은지 알 수 있습니다. 여기에 이미지 설명을 입력하세요

나는 이것을 시도하지 않았지만 이론적으로는 동일해야 합니다. Fancy Zone이라는 앱과 함께 제공되는 Windows PowerToys를 설치할 수 있습니다. 이 앱을 사용하면 화면 주위에 영역을 생성한 다음 을 눌러 애플리케이션을 그 안에 놓을 수 있습니다. SHIFT를 누르고 앱을 영역으로 드래그합니다. 이렇게 하면 미리 정의한 영역 크기로 응용 프로그램의 크기가 자동으로 조정됩니다.

답변3

userChrome.cssFirefox에서는 최소 너비를 재정의하는 데 사용할 수 있습니다 .

  1. 로 이동하여 true로 about:config설정하세요 .toolkit.legacyUserProfileCustomizations.stylesheets
  2. 사용자 프로필을 찾으세요.폴더 이름은 30t5gfdj.default-release또는 와 같은 이름이어야 합니다 30t5gfdj.default.
  3. 사용자 프로필 폴더에 이라는 폴더를 만듭니다 chrome. 에서 chrome.라는 파일을 만듭니다 userChrome.css. 따라서 전체 경로는 다음과 같이 끝나야 합니다 Mozilla/Firefox/Profiles/30t5gfdj.default-release/chrome/userChrome.css.
  4. 입력이 완료 되면 userChrome.css브라우저를 다시 시작하여 변경 사항을 적용합니다.

userChrome.css내 파일 의 내용은 다음과 같습니다 .

@namespace html url("http://www.w3.org/1999/xhtml");

:root {
  min-width: 1px !important;
}

관련 정보