반응형
각각의 두 태그들의 차이는 시맨틱 웹과 연관있다.
<b>태그와 <strong> 태그 모두 해당 태그에 감싸져있는 부분을 진하게 표시해준다.
<i> 태그와 <em> 태그는 해당 태그에 감싸져있는 부분을 italic체로 기울여지게 한다.
보통 네 가지 모두 태그 강조하고 싶은 부분을 강조하기 위해 사용한다.
📝 예제 코드
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p><b>b태그</b>와 <strong>strong태그</strong>의 차이점</p>
<p><i>i태그</i>와 <em>em태그</em>의 차이점</p>
</body>
</html>
📄 결과
겉보기에는 두 태그들의 차이가 없어보인다.
그러나 의미론적으로 차이가 존재한다.
<b> 태그는 단순히 글자를 굵게 보이게하는 것에 그친다.
그러나 <strong> 태그는 글자를 굵게 하는데에 그치지 않고, <strong> 태그로 감싸진 내용들이 중요한 내용이라는 것을 브라우저에게 알려주는 역할을 한다.
<i> 태그와 <em> 태그의 차이도 마찬가지이다.
<strong> 태그와 <em> 태그는 시맨틱 요소로써 의미를 가지게 된다.
시맨틱 웹을 적용하는 게 요즘 추세가 되면서 <b> 태그와 <i> 태그는 전보다 많이 사용되지 않는다.
반응형
