지수,단위,화학식 표현할때 HTML 태그로 첨자넣기

HTML/CSS를 잘해야 블로그를 할수 있을까요? 그건 아닙니다. 하지만 기초 지식을 알고 있으면 블로그를 운영하는데 큰 도움이 됩니다. 소소한 팁 중 하나인 아래첨자와 윗첨자 넣는 방법 알아보겠습니다.

 

윗첨자는 단위나 지수를 표현하는데 많이 사용됩니다. 아랫첨자는 화학식에 주로 사용되고요. 윗첨자는 <sup> 태그, 아래첨자는 <sub> 태그로 표현할 수 있습니다.

1. <sup> 윗첨자 표현하기

원하는 구문 사이에 <sup>태그를 사용하면 됩니다. 단위나 지수의 승수를 표시할 때 유용합니다.

m²은 넓이 m³은 부피, m/s²은 가속도 단위입니다.

위의 문장은 html 편집모드에서 아래 코드와 같이 숫자부분에 <sup>태그를 넣어주면 됩니다.

m<sup>2</sup>은 넓이 m<sup>3</sup>은 부피, m/s<sup>2</sup>은 가속도 단위입니다.

문자표에 있는 단위보다 이렇게 <sup> 태그를 이용하면 글자가 훨씬 깔끔해 보이고 가독성도 좋아집니다.

문자표 : ㎡, ㎢, ㎨   /  <sup>태그 : m², km², m/s²

2. <sub> 아래첨자 표현하기

원하는 구문에 태그를 넣어주면 됩니다. 아래첨자는 화학식이나 수식에 사용하면 유용합니다. 아래는 우리가 사용하는 연료인 메탄, 프로판, 부탄의 화학식입니다.

메탄 : CH₄

프로판 : C₃H₈

부탄 : C₄H₁₀

위의 문장은 html 편집모드에서 아래 코드와 같이 숫자부분에 <sub>태그를 넣어주면 됩니다.

<p>메탄 : CH<sub>4</sub></p>
<p>프로판 : C<sub>3</sub>H<sub>8</sub></p>
<p>부탄 : C<sub>4</sub>H<sub>10</sub></p>

---

위첨자, 아래첨자 태그 그렇게 어렵지 않죠? 위는 수퍼<sup>, 아래는 서브<sub>! 공학, 과학, IT 등 전문적인 블로그를 운영하는 분이라면 이 태그 꽤 유용합니다.