CSS :before/:after 의사 요소 내에서 이미지 높이를 제어할 수 있나요?

CSS :before/:after Pseudo-Elements에서 이미지 높이를 조정할 수 있나요?

질문은 높이 수정이 가능한지 여부입니다. CSS :before/:after 의사 요소 내에서 사용되는 이미지. 배경 이미지의 크기를 조정할 수 있지만 의사 요소 이미지에도 동일한 작업이 가능한지 즉시 알 수 없습니다.

해결책:

조정하여 목표를 부분적으로 달성할 수 있습니다. 의사 요소의 배경 크기 속성. 그러나 이미지를 둘러싸는 블록의 너비와 높이를 정의해야 한다는 점을 명심하세요.

.pdflink:after {
    background-image: url('/images/pdf.png');
    background-size: 10px 20px;
    display: inline-block;
    width: 10px;
    height: 20px;
    content: "";
}

이 방법을 사용하면 지정된 블록 내의 이미지 크기를 제어할 수 있습니다. 그러나 블록 자체의 전체 크기도 그에 따라 설정해야 합니다.

대체 솔루션:

소스 이미지 크기 조정에 대한 의구심을 표현했거나 인라인 IMG 태그를 포함하도록 마크업을 수정합니다. 그러나 호환성이 최우선인 경우 CSS에만 의존하는 것보다 이러한 옵션이 더 안정적일 수 있습니다.

위 내용은 CSS :before/:after 의사 요소 내에서 이미지 높이를 제어할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!