C#에서 HTML 이미지 관리

.NET용 HTML 이미지 관리 API

Aspose.HTML for .NET 은 HTML 문서가 참조하는 이미지를 처리하기 위한 DOM 및 리소스 API를 제공합니다. C# 애플리케이션에서 HTMLImageElement 를 생성하거나 수정하고, CSS 선택자로 이미지 요소를 찾고, DOM에서 제거하고, 참조 리소스를 확인한 다음 수정된 HTML을 저장할 수 있습니다.

HTML 이미지 작업 선택

• HTML에 이미지 추가 . <img> 요소를 생성하고 소스, 대체 텍스트, 크기 및 선택적 최신 속성을 설정한 다음 필요한 DOM 위치에 삽입합니다.
• HTML에서 이미지 추출 . 이미지 참조를 찾고 문서의 기본 주소를 기준으로 상대 URL을 확인한 다음 지원되는 로컬, 원격 또는 포함 리소스를 저장합니다.
• HTML에서 이미지 제거 . 선택한 <img> 요소를 DOM에서 제거하고, 마크업 제거와 실제 이미지 파일 또는 CSS 배경 리소스 삭제를 구분합니다.
• HTML 이미지 크기 조정 . 참조된 원본 파일을 리샘플링하지 않고 표시 이미지의 고유 크기와 반응형 CSS를 설정합니다.

C#에서 기존 HTML 이미지 수정

이 예제는 HTML 파일을 로드하고 ID로 기존 이미지를 선택한 다음 참조 리소스와 대체 텍스트를 변경하고 고유 크기를 설정하여 수정된 문서를 저장합니다. 이미지 파일은 Src에 지정된 경로에서 계속 사용할 수 있어야 합니다.

using Aspose.Html;

// Load the source HTML file
using HTMLDocument document = new HTMLDocument("input.html");

// Select and update the existing image element
HTMLImageElement image =  document.QuerySelector("#product-image") as HTMLImageElement;

if (image != null)
{
    image.Src = "images/updated-product.webp";
    image.Alt = "Updated product shown from the front";
    image.SetAttribute("width", "960");
    image.SetAttribute("height", "640");
}

// Save the modified HTML document
document.Save("output.html");

HTML 이미지 관리 기본 단계

1. HTMLDocument 생성자로 원본 파일, URL, 문자열 또는 스트림을 로드하고 상대 리소스를 확인해야 할 때 올바른 기본 주소를 제공합니다.
2. QuerySelector() 로 이미지 하나를 찾거나 QuerySelectorAll() 로 여러 일치 항목을 수집합니다.
3. 필요한 작업에 따라 선택한 이미지 요소를 생성, 수정, 제거 또는 검사합니다.
4. 파일을 복사, 다운로드, 포함, 최적화 또는 삭제해야 할 때 참조 이미지 리소스를 별도로 처리합니다.
5. Save() 를 호출하여 마크업 변경 사항을 저장하거나, HTML을 PDF 또는 이미지 형식으로 렌더링해야 할 때 변환 작업으로 진행합니다.

HTML 이미지 요소, 소스 및 리소스

• 이미지 속성. 대상 마크업에서 지원하는 src, alt, width, height, loading, decoding, srcset, sizes 및 기타 속성을 읽거나 수정합니다.
• DOM 배치. 문서 본문이나 선택한 컨테이너에 이미지를 추가하고, 다른 부모로 이동하거나, 교체하거나, 문서 트리에서 제거합니다.
• 리소스 위치. 문서의 기본 주소를 고려하면서 상대 경로, 절대 HTTP 또는 HTTPS URL, 파일 URL 및 포함 데이터 URI를 처리합니다.
• 요소 선택. ID, 클래스, 속성 선택자, 구조 선택자, XPath 또는 DOM 탐색을 사용하여 이미지 하나나 이미지 컬렉션을 대상으로 지정합니다.
• 표시 크기. 고유 width 및 height 값과 CSS를 결합하여 고정 또는 반응형 레이아웃을 구성합니다.
• img 이외의 이미지. CSS 배경 이미지, SVG 콘텐츠, <picture> 소스, 파비콘 및 이미지 입력은 다른 요소나 스타일 규칙을 사용하므로 별도의 선택 로직이 필요합니다.
• 출력 API. 렌더링된 전체 페이지를 PNG, JPEG, TIFF 또는 지원되는 다른 형식으로 저장해야 할 때 준비된 문서를 변환 작업에 전달합니다.

HTML 이미지 설명서 및 API 참조

<img> 요소, 포함 데이터 및 CSS 배경 예제는 How to Add Image to HTML 을 참조하세요. Working with HTML Documents 에서는 문서 로드, 편집, 저장 및 리소스 처리를 설명합니다. 이미지 속성과 상속된 DOM 메서드는 HTMLImageElement 참조에서 확인할 수 있습니다.

Aspose.HTML for .NET 설치

.NET CLI를 사용하여 NuGet에서 Aspose.HTML for .NET 을 설치합니다.

dotnet add package Aspose.HTML

NuGet 패키지 관리자 UI를 사용하거나 패키지 관리자 콘솔에서 Install-Package Aspose.HTML을 실행할 수도 있습니다. 설정 방법은 설치 가이드 를 참조하세요. 평가 제한 없이 API를 테스트하려면 임시 라이선스 를 요청할 수 있습니다.

HTML 이미지 관리 FAQ

1. Aspose.HTML에서 PNG 또는 JPEG 파일의 픽셀을 편집할 수 있나요?

아니요. 이미지 관리 작업은 HTML 요소, 속성, 스타일 및 참조 리소스를 수정합니다. 리샘플링, 자르기, 압축 및 픽셀 단위 편집에는 별도의 이미지 처리 단계가 필요합니다.

2. HTML 처리 시 이미지 상대 경로는 어떻게 확인되나요?

상대 src 값은 일반적으로 로드된 파일이나 URL의 위치에서 가져오는 문서 기본 주소를 기준으로 확인됩니다. 문자열이나 스트림에서 HTML을 생성하는 경우 애플리케이션이 상대 리소스 경로를 올바르게 확인할 수 있도록 기본 URL을 제공합니다.

3. HTML에서 이미지를 추출하는 것과 HTML을 이미지로 변환하는 것은 같은가요?

아니요. 추출은 <img> 요소가 사용하는 JPEG처럼 요소나 스타일이 참조하는 리소스를 저장합니다. HTML을 이미지로 변환 하면 전체 페이지 레이아웃을 새로운 래스터 출력으로 렌더링합니다.