html 기초 정리 - (5) 기타 태그들

frenchkebab·2021년 10월 18일
0

기타 자주 쓰이는 태그들 정리


1. abbr 태그

<abbr title="풀네임">약어</abbr>

예시

<p>너.. 혹시 <abbr title="Attention Deficit Hyperactivity Disorder">ADHD</abbr>니?</p>

실행 화면


2. address 태그


<address>연락처</address>

address 예시

<address>
  <h1>frenchkebab</h1>
  <a href="https://velog.io/@frenchkebab">https://velog.io/@frenchkebab</a>
</address>

실행 화면

address 태그 안에 올 수 있는 정보들

  1. (물리적인) 주소
  2. URL
  3. 이메일 주소
  4. 전화번호
  5. SNS

3. pre, code 태그


둘이 비슷하지만 살짝 다르다!

pre 태그

: preformatted text

'format이 정해지기 전' 이라는 의미이다.

<p>
  frenchkebab
  프렌치케밥
</p>
<pre>
  frenchkebab
  프렌치 케밥
</pre>

실행 화면

인덴트까지 반영되어 그대로 표시되는 것을 확인할 수 있다.
code를 작성할 때 자주 사용한다.


code 태그와 함께 사용

<pre>
  <code>
    console.log('hello frenchkebab');
    let frenchkebab = 'frenchkebab';
  </code>
</pre>

실행 화면

code 태그를 여러 줄에 걸쳐서 사용하고 싶을 때 사용하면 된다.

profile
Blockchain Dev Journey

0개의 댓글