HTML 자주 사용하는 태그

span

- 인라인 요소입니다.

- 특정 글자만 묶어서 속성을 지정합니다.

나중에 CSS에 대하여 자세히 다루겠지만,

우선 span 태그로 글자를 묶어서 속성을 지정해보자.

head 태그에 span 태그용 스타일로 글자색을 입력한다.

본문 내용은 body 태그에 동요 반달을 입력하고

span 태그로 그 중 일부 글자색을 변경한다.

웹 브라우저로 결과를 보면,

[참고]

한자 : 등대(燈臺)

<BR> : 줄바꿈 태그, 인라인 요소로 분류하지만 다른 기능이 없다.

반달에서 나온 ㅉ(쌍지읏) 부분은 원래 ㅅㅈ(시옷지읏)으로 되어 있다.

조합형이 아닌 현재의 한글 유니코드로는 표현할 수 없다.

전체 HTML 코드

<!DOCTYPE html>
<html>
  <head>
    <style>
      span { color: royalblue; }
    </style>
  </head>
  <body>
    <p>반달</p>
    <p>
      <span>푸른한울</span> 은하물 하얀쪽배에<BR>
      계수나무 한나무 톡긔한머리<BR>
      돗대도 아니달고 삿대도업시<BR>
      가기도 잘도간다 西쪽나라로<BR>
    </p>
    <p>
      <span>은하물</span>을 건너서 구름나라로<BR>
      구름나라 지나선 어대로가나<BR>
      멀니서 반짝반짝 빗초이는것<BR>
      샛-별 燈臺란다 길을차저라<BR>
    </p>
     - 『어린이』제2권 제 11호, 개벽사, 1924년
  </body>
</html>

동요 - 반달

https://www.youtube.com/watch?v=7ejhlhtYR34

저작자표시 비영리 변경금지

'개발 > 웹 (HTML)' 카테고리의 다른 글

HTML 자주 사용하는 태그 - <a> (0)	2024.11.20
HTML 자주 사용하는 태그 - <ul><ol><li> (0)	2024.11.18
HTML 블록 요소 개념 잡기 (1)	2024.11.17
HTML 인라인 요소 개념 잡기 (0)	2024.11.16
코드 가독성을 높이는 HTML 빈 태그와 주석 이야기 (0)	2024.11.15
HTML 기본 구조와 DTD 개념 정리 (0)	2024.11.11
VSCode 웹 개발 시작하기 - Live Server로 만드는 '니' 첫 번째 웹 페이지 (2)	2024.11.09
VSCode 언어별 들여쓰기(탭) 지정 - Settings.json (1)	2024.11.08