CSS에서 요소를 숨기는 방법

CSS는 웹 페이지의 영어를 마스터하는 것이므로 CSS 숨기기는 전체 요소를 숨기는 것이 아니라 인쇄할 때 요소를 숨깁니다. 웹 페이지를 인쇄할 때 용지에 올바르게 표시되도록 스타일을 조정해야 합니다. 그러나 웹 페이지의 특정 요소를 인쇄하고 싶지 않은 상황이 있습니다. 다행히 CSS는 이러한 요소를 숨길 수 있는 방법을 제공합니다.

1단계: 숨기려는 요소에 대한 CSS 클래스를 정의합니다.
먼저 숨기려는 요소를 숨기려면 CSS 클래스를 만들어야 합니다. 예를 들어 ID가 "header"인 div 요소를 숨기려면 "no-print"라는 클래스를 만들어 숨길 수 있습니다. CSS 파일에 다음 스타일을 추가할 수 있습니다:

.no-print {
display: none;
}

이 스타일은 이 "no-print" 클래스가 적용되는 모든 요소를 ​​숨깁니다.

2단계: 숨기려는 요소에 CSS 클래스 적용
이제 숨기려는 요소에 "no-print" 클래스를 적용해야 합니다.

여기로 제목

헤더 섹션입니다.

위 코드의 div 요소는 웹 페이지에 표시되지만 인쇄 시 요소를 숨기는 "인쇄 불가" 카테고리를 사용하기 때문에 인쇄 시에는 인쇄되지 않습니다.

3단계: 인쇄 효과 테스트
인쇄가 인쇄 미리보기의 요소를 성공적으로 숨겼는지 테스트할 수 있습니다. 숨기기에 성공하면 "인쇄 안 함"으로 표시된 요소는 페이지를 인쇄할 때 인쇄되지 않습니다.

일부 고급 사용자는 개발자 도구를 사용하여 숨겨진 스타일을 상쇄할 수 있으므로 이 숨김이 완벽하지 않다는 점에 유의하는 것이 중요합니다. 그러나 대부분의 사용자에게 이 방법은 여전히 ​​웹 페이지 요소를 숨기는 실행 가능한 방법입니다.

위 내용은 CSS에서 요소를 숨기는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

css print class this display

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.