Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML5에서 SVG 이미지를 사용하는 방법은 무엇입니까?

HTML5에서 SVG 이미지를 사용하려면 요소 또는 를 사용하세요. SVG 파일을 추가하려면 HTML에서 또는 요소를 사용할 수 있습니다. 귀하의 요구 사항에 따라 그 중 하나를 선택하십시오.

SVG 이미지를 추가하는 방법은 다음과 같습니다. SVG를 파일로 저장하면 SVG 이미지로 바로 사용할 수 있습니다.

HTML5에서 SVG 이미지를 사용하는 방법은 무엇입니까?

예시

SVG 이미지를 사용하기 위해 다음 코드를 실행할 수 있습니다.

<!DOCTYPE html>
<html>
   <head>
      <style>
         #svgelem {
            position: relative;
            left: 50%;
            -webkit-transform: translateX(-20%);
            -ms-transform: translateX(-20%);
            transform: translateX(-20%);
         }
      </style>
      <title>HTML5 SVG Image</title>
   </head>
   <body>
      <h2 align="center">HTML5 SVG Image</h2>
      <img src="https://www.tutorialspoint.com/html5/src/svg/extensions/imagelib/smiley.svg" alt="smile" height="100px" width="100px" />
   </body>
</html>