<strong>와 <em> 태그

약 4분

본문 듣기

HTML 기초: <strong>와 <em> 태그

HTML은 웹 페이지를 구성하는 뼈대 역할을 하며, 이 안에 다양한 내용을 담을 수 있도록 돕는 언어입니다. 오늘은 텍스트 관련 태그 중 특히 강조를 위해 사용되는 태그와 태그에 대해 알아보겠습니다.

<strong> 태그란?

태그는 '강조'를 뜻하는 태그입니다. 이 태그로 감싼 내용은 웹 페이지에서 더 두껍고 눈에 띄게 표시됩니다. 예를 들어, 중요한 내용을 강조하고 싶을 때 이 태그를 사용합니다. 예를 들어볼까요?

코드 html
<p>이것은 <strong>중요한</strong> 내용입니다.</p>

위의 예제에서 '중요한'이라는 단어는 태그로 감싸져 있어, 웹 페이지에서 두껍게 보이게 됩니다. 즉, 사용자가 이 내용이 중요하다는 것을 쉽게 인식하게 합니다.

<em> 태그란?

태그는 '강조'를 요구하지만, 조금 더 부드럽고 기울어진 형태로 나타납니다. 예를 들어, 내 감정이나 생각을 표현하고 싶을 때 사용합니다. 아래 예제를 보세요.

코드 html
<p>나는 <em>사랑</em>을 믿어요.</p>

위의 코드에서 '사랑'이라는 단어는 태그로 감싸져 있어, 기울어진 형태로 보입니다. 이 표현은 강렬하지 않지만 의미를 드러내는 데 도움을 줍니다.

실습: HTML 문서 만들기

자, 이제 여러분의 손으로 직접 실습해볼 시간입니다! 아래의 단계를 따라 해보세요.

  1. VS Code를 엽니다.
  2. 새로운 HTML 파일을 만듭니다 (예: index.html).
  3. 아래 코드를 작성합니다.
코드 html
<!DOCTYPE html>
<html>
<head>
    <title>나의 첫 HTML</title>
</head>
<body>
    <h1>환영합니다!</h1>
    <p>여기서 <strong>중요한</strong> 내용을 강조할 수 있고, <em>느낌</em>을 표현할 수 있습니다.</p>
</body>
</html>
  1. 파일을 저장하고 브라우저에서 열어 결과를 확인합니다.

핵심 요약

오늘 우리는 와 태그를 사용하여 텍스트를 강조하는 방법에 대해 배웠습니다. 태그는 중요한 내용을 두껍게, 태그는 기울여서 부드럽게 강조할 수 있습니다. 이러한 태그를 사용하여 웹 페이지의 내용을 더욱 풍부하게 만들 수 있습니다.

실습 문제

다음 문장을 과 태그를 사용하여 HTML로 표현해보세요:
'하늘은 정말 푸르다.'

개인 프로젝트: 나의 자기소개 페이지 만들기

자, 이제 마지막으로 여러분만의 자기소개 페이지를 만들어볼 시간입니다! 여러분의 이름, 좋아하는 취미, 그리고 자신을 소개하는 간단한 문장을 작성해 보세요. 각 항목에 나 태그를 적절히 사용해서 더욱 멋진 페이지를 만들어봅시다!

이 과정을 통해 HTML의 기본적인 태그를 익혔으니, 이제 여러 웹 페이지에서 활용해 볼 수 있습니다. 계속해서 배우며 성장해 나가세요!

댓글 0

댓글을 남기려면 로그인하세요.

아직 댓글이 없습니다. 첫 댓글을 남겨보세요.