Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML var 태그 완벽 가이드: 변수 텍스트 서식 지정 방법과 예제

HTML의 <var> 태그는 문서 내에서 변수(variable)를 나타내는 텍스트의 서식을 지정할 때 사용합니다. 주로 수학 표현식이나 프로그래밍 관련 문서에서 변수를 의미 있게 강조하고 싶을 때 활용됩니다.

var 태그의 특징

<var> 태그로 감싼 텍스트는 대부분의 브라우저에서 기본적으로 이탤릭체(기울임꼴)로 표시됩니다. 시맨틱(Semantic) 태그이기 때문에 화면 표시뿐만 아니라 검색 엔진과 스크린 리더에게도 해당 텍스트가 '변수'라는 의미 정보를 전달할 수 있다는 장점이 있습니다.

  • 수학 공식이나 방정식에서 변수 표현
  • 프로그래밍 문서에서 변수명 강조
  • CSS를 통해 원하는 스타일로 자유롭게 변경 가능

사용 예제

아래 코드를 실행하면 <var> 태그를 사용해 변수 서식을 지정한 결과를 직접 확인할 수 있습니다.

<!DOCTYPE html>
<html>
   <head>
      <title>HTML var Tag</title>
   </head>
  <body>
      <p>방정식: <var>2x</var> - <var>3z</var> = <var>5y</var> + 2 그리고
         <var>2x</var> + <var>5z</var> = <var>2y</var> + 7
      </p>
  </body>
</html>

실행 결과

위 코드를 브라우저에서 열면 '2x', '3z', '5y' 등 변수 부분이 이탤릭체로 표시되어 일반 텍스트와 구별됩니다. 만약 다른 스타일을 적용하고 싶다면 CSS의 font-style, font-weight 등의 속성으로 손쉽게 커스터마이징할 수 있습니다.