[HTML][CSS] 페이지 넘김 및 프린터 출력 여백 설정

풍선도움말...

ㆍ돈 걱정을 하지않아도 되는 편안한 삶을 상상해 보세요.

금융신고
1332

온비드

주택금융공사

[무료] 오늘의 운세 / 바이오리듬

여기는 회원님이 직접 등록하신
즐겨찾는 사이트가 출력됩니다.

컴퓨터와 관련있는 모든 팁을 공유합시다.

[HTML][CSS] 페이지 넘김 및 프린터 출력 여백 설정

호가계부|2019-09-30 18:41:44|조회 : 137834

홈페이지에서 프린터로 출력할때 페이지 넘김이 필요할 때가 있다

css 에서

page-break-before : 해당 엘리컨트 뒤에 페이지 넘김

또는

page-break-after : 해당 엘리먼트 앞에 페이지 넘김

으로 설정하면 된다

[설정값]
- auto : 기본값
- always : 항상 페이지 넘김
- avoid : 페이지 넘김을 하지 못하게 강제

P 또는 DIV 와 같은 블럭 레벨 엘리먼트에만 적용된다.

<p style="page-break-before: always;"> 페이지 넘김 </p>

페이지 여백을 screen, print 에 맞게 설정할 수 도 있다.

@media screen {
body {
margin-top: 10mm;
margin-bottom: 10mm;
margin-left: 0mm;
margin-right: 0mm
}
}

@media print {
body {
margin-top: 50mm;
margin-bottom: 50mm;
margin-left: 20mm;
margin-right: 20mm
}
}

TAG : 홈페이지_페이지넘김

호가계부	2022-10-19 13:23:01

프린트 가로, 세로 출력 설정 CSS

@page { size: A4 landscape; margin:0; } //A4 가로 출력

@page { size: A4 portrait; margin:0; } //A4 세로 출력

번호	제 목	첨부	작 성 일	작성자	조회
127	PHP-FPM을 재시작하는 명령어		2025-06-25	호가계부	527
126	[리눅스] chgrp 명령어		2025-04-04	호가계부	1578
125	[윈도우] Windows에서 폴더의 내용을 텍스트 파일로 저장하는 방...		2023-08-22	호가계부	3369
124	[javascript] select potion 제어 변수들		2022-10-17	호가계부	1454
123	[리눅스] gzip 압축풀기		2022-09-17	호가계부	1102
122	[php] 날짜 계산 예제		2022-07-25	호가계부	1759
121	[엑셀] 셀에 날짜 입력 단축키		2022-06-30	호가계부	1562
120	[html5] 스마트폰 웹브라우저 상단바 없애는 방법		2022-05-18	호가계부	2323
119	[html5] datalist 사용법 (1)		2022-02-03	호가계부	4016
118	[Android] android studio 설치 및 셋팅 (2)		2021-06-05	호가계부	2242
117	[MySql] 날짜 비교 검색 (오늘, 어제, 한달전...)		2021-06-01	호가계부	5027
116	phpMyAdmin 설치 및 오류 해결 (2)		2021-04-26	호가계부	34906
115	MS 엣지 강력한 새로고침 (1)		2020-11-12	호가계부	1500
114	cURL 사용법 (6)		2020-05-16	호가계부	5399
113	[Javascript] 숫자를 글자로 바꿔주는 자바스크립트 (1)		2020-03-11	호가계부	1555
112	[엑셀] 셀을 클릭하면 설명 메시지를 팝업 시키는 방법 (1)		2019-11-07	호가계부	9533
111	[Javascript] confirm 클릭 확인받기		2019-10-09	호가계부	22977
110	[HTML][CSS] 페이지 넘김 및 프린터 출력 여백 설정 (1)		2019-09-30	호가계부	137834
109	[javascript] window.open으로 오픈한 자식창에서 부모창 태그 �...		2019-09-27	호가계부	3013
108	[jQuery] 익스플로러 외 날짜 입력박스 사용하기(input type dat... (1)		2019-09-23	호가계부	263766

| [1] 2 3 4 5 6 |

컴퓨터와 관련있는 모든 팁을 공유합시다.

[HTML][CSS] 페이지 넘김 및 프린터 출력 여백 설정

PHP-FPM을 재시작하는 명령어

[리눅스] chgrp 명령어

[윈도우] Windows에서 폴더의 내용을 텍스트 파일로 저장하는 방...

[javascript] select potion 제어 변수들

[리눅스] gzip 압축풀기

[php] 날짜 계산 예제

[엑셀] 셀에 날짜 입력 단축키

[html5] 스마트폰 웹브라우저 상단바 없애는 방법

[html5] datalist 사용법

[Android] android studio 설치 및 셋팅

[MySql] 날짜 비교 검색 (오늘, 어제, 한달전...)

phpMyAdmin 설치 및 오류 해결

MS 엣지 강력한 새로고침

cURL 사용법

[Javascript] 숫자를 글자로 바꿔주는 자바스크립트

[엑셀] 셀을 클릭하면 설명 메시지를 팝업 시키는 방법

[Javascript] confirm 클릭 확인받기

[HTML][CSS] 페이지 넘김 및 프린터 출력 여백 설정

[javascript] window.open으로 오픈한 자식창에서 부모창 태그 �...

[jQuery] 익스플로러 외 날짜 입력박스 사용하기(input type dat...