<b>와 <strong>, <i>와 <em>의 차이점은 무엇입니까?

사이의 차이가 무엇인가 <b>와 <strong>, <i>및 <em>HTML / XHTML의는? 언제 사용해야합니까?

그것들은 일반적인 웹 브라우저 렌더링 엔진과 동일한 효과를 갖지만 근본적인 차이점 이 있습니다.

저자 가 토론 목록에 글을 쓸 때 :

세 가지 상황을 생각해보십시오.

• 웹 브라우저
• 맹인
• 휴대 전화

"굵게"는 스타일입니다. "굵게" 단어 를 말할 때 사람들은 기본적으로 글자 주위에 더 많은 단어 를 추가해야한다는 것을 알고 있습니다.

불행히도 그것은 맹인에게는 아무 의미가 없습니다. 휴대폰 및 기타 PDA에서는 화면 해상도가 매우 작기 때문에 텍스트가 이미 굵게 표시됩니다. 무언가를 망치지 않으면 굵게 굵게 표시 할 수 없습니다.

<b>스타일입니다 -우리는 "굵게"보이는 모습을 알고 있습니다.

<strong>그러나 어떻게 이해해야하는지에 대한 표시이다 . "Strong"은 브라우저에서 "굵게"를 의미 할 수 있지만 종종 Jaws (맹인용)와 같은 말하기 프로그램의 톤이 낮거나 밑줄로 표시 될 수 있습니다 ( Palm Pilot에서 굵게 표시)

HTML은 스타일에 관한 것이 아닙니다. 수행 어떤 검색을 위해 "팀 버너스 - 리" 와 "시맨틱 웹." <strong>의미 론적 — 텍스트를 둘러싸 는 텍스트를 표시 하는 방법 (예 : "이 텍스트는 텍스트를 표시해야하는 나머지 텍스트보다 더 강해야 함" )과 같이 텍스트 를 설명 합니다 . 굵게 " ).

<b>및 <i>명시 적 - 그들은 각각 굵은 이탤릭체 지정합니다.

<strong>과 <em>의미 - 그들은이 포함 된 텍스트가 "강력한"또는 일반적으로 굵은 기울임 꼴, 어떤 방법으로 "강조"인 것을 지정하지만, 실제 스타일은 CSS를 통해 제어 할 수 있습니다. 따라서 이들은 현대 웹 페이지에서 선호됩니다.

<strong>및 <em>문서에 여분의 의미 론적 의미를 추가합니다. 그들은 또한 텍스트에 대담하고 이탤릭 스타일을 부여합니다.

CSS로 스타일을 덮어 쓸 수도 있습니다.

<b>그리고 <i>다른 한편으로 전용 글꼴 스타일을 적용하고 더 이상 사용되지해야합니다. (CSS로 포맷해야하기 때문에 텍스트가 실제로 중요하다면 어쨌든 "강하게"또는 "강조로"만들 것입니다!

이해가 되길 바랍니다.

제안 된 사용법과 함께 정의에 대한 요약은 다음과 같습니다.

<b>...주의가 여분의 중요성을 전달하지 않고 같은 다른 음성 또는 분위기, 전혀 의미와 실용적인 목적으로 그려지되는 텍스트 범위 핵심 단어 문서 초록, 제품 이름 리뷰, 실행 가능한 단어 에서 대화식 텍스트 중심 소프트웨어 또는 기사 lede .

<strong> ... 현재는 강조하기보다는 중요성을 나타냅니다.

<i>... 대체 음성 또는 분위기의 텍스트 범위 또는 분류 학적 지정 , 기술적 용어 , 다른 언어 의 관용구 , 생각 과 같은 다른 텍스트 품질을 나타내는 방식으로 정상적인 산문과 상쇄됩니다. 또는 서양 텍스트 의 선박 이름 .

<em> ... 강조를 나타냅니다.

(이것들은 W3C 소스에서 직접 인용 한 것입니다. 내 강조가 추가되었습니다. https://rawgithub.com/whatwg/html-differences/master/Overview.html#changed-elements 및 http://www.w3.org 참조 원본의 경우 /TR/html401/struct/text.html#h-9.2.1 )

<b>그리고 <i>반면에 모두 스타일 관련 <em>과 <strong>의미합니다. HTML 4에서 첫 번째는 글꼴 스타일 요소 로 분류되고 후자는 구 요소 로 분류됩니다 .

브라우저가 종종 이탤릭체로 렌더링하기 때문에 올바르게 표시 <i>하고 <em>종종 유사한 것으로 간주됩니다. 그러나 사양에 <em> 따르면 강조 표시 및 강조 <strong> 표시가 더 명확하지만 종종 잘못 해석됩니다. 반면에 언제 사용 <i>하는지 또는 <b>실제로 스타일의 문제 인지 의 차이는 다릅니다 .

동안 <strong>과 <em>물론 더 의미 론적으로 올바른으로하며, 사용에 확실한 정당한 이유가 보인다 <b>및 <i>고객이 작성한 내용 태그.

그러한 내용에서, 단어 또는 문구는 굵게 또는 이탤릭체로 표시 될 수 있으며, 그러한 굵게 또는 이탤릭체로의 의미 론적 추론을 분석하는 것은 일반적으로 우리에게 달려 있지 않다.

또한, 그러한 내용은 특정 의미를 전달하기 위해 굵은 체 및 이탤릭체로 된 단어 및 문구를 지칭 할 수있다.

예를 들어 영어 시험 문제는 학생에게 굵은 체 단어를 바꾸도록 지시합니다.

<em>그리고 <strong>보다 더 많은 대역폭을 소비 <i>하고<b> .

또한 더 많은 타이핑이 필요합니다 (자동 생성되지 않은 경우).

또한 더 많은 텍스트로 편집기 화면을 어지럽 힙니다. 더 작은 소스 파일과 같은 프로그래머라면 같은 것을 기억합니다. (그리고 현실화하자, 그들은 동일합니다. 예, "기술적"(<i> 기침 </ i>, 아헴, 실례합니다) 차이가 있지만, 그것은 대부분 처음부터 가짜입니다.)

위의 태그 중 하나를 사용하면 스타일 시트를 사용하여 기본 렌더링과 다르게 표시해야하는 경우 원하는대로 표시되는 방식을 사용자 정의 할 수 있습니다.

다른 사람들이 말했듯이 <b>와 <i>는 명시 적이지만 (예 : "이 텍스트는 굵게 표시"), <strong>와 <em>은 의미 론적입니다 (예 : "이 텍스트는 강조해야합니다").

최신 웹 브라우저와 관련하여 차이를보기는 어렵지만 (두 가지 모두 동일한 결과를 낳는 것처럼 보입니까?) 시각 장애인을위한 화면 판독기를 생각하십시오. 스크린 리더가 <i> 태그를 발견하면 어떻게해야할지 모릅니다. 그러나 <em> 태그를 발견하면 그 안에있는 모든 것이 청취자에게 강조되어야한다는 것을 알고 있습니다. 그리고 거기에는 실제적인 차이가 있습니다.

<i>, <b>, <em>및 <strong>태그 전통적으로 재현된다. 그러나 HTML5 에서 새로운 의미 적 의미 가 부여되었습니다 .

<i>그리고 <b>HTML4에서 글꼴 스타일을 위해 사용되었다. <i>기울임 꼴 및 <b>굵게 사용되었습니다 . HTML5 <i>태그에서 ' 대체 음성 또는 분위기 ' 라는 새로운 의미 의미를 가지며 <b>태그는 스타일 적으로 오프셋 된 의미를 갖습니다 .

<i>태그의 사용 예는 분류 학적 명칭, 기술 용어, 다른 언어의 관용구, 음역, 생각, 서구의 선박 이름입니다. 와 같은-

<p><i>I hope this works</i>, he thought.</p>

사용 예 <b>태그의 문서 추출의 키워드, 리뷰의 제품 이름, 대화 형 텍스트 기반 소프트웨어의 실행 가능한 단어, 기사 리드입니다.

다음 예제 단락은 그 뒤에 나오는 단락과 문체 적으로 오프셋되어 있습니다.

<p><b class="lead">The event takes place this upcoming Saturday, and over 3,000 people have already registered.</b></p>

<em>와 <strong>HTML4의 강조와 강한 강조의 의미를 가지고 있었다. 그러나 HTML5의 <em>수단 강조 강조 하고 <strong>수단 강력한 중요성을 .

다음 예에서는 이전 에 단어를 읽는 동안 언어 학적 변화가 있어야합니다 .

<p>Make sure to sign up <em>before</em> the day of the event, September 16, 2016</p>

같은 예 <strong>에서 다음과 같이 태그를 사용할 수 있습니다 .

<p>Make sure to sign up <em>before</em> the day of the event, <strong>September 16, 2016</strong></p>

행사 날짜에 중요성을 부여합니다.

MDN 참조 :

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/b

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/strong

다른 사람들이 말했듯이 차이점은 글꼴 스타일 <b>과 <i>하드 코드 스타일 <strong>이며<em> (브라우저 억양을 말하거나, 또는 무엇을 당신이 -이) 글꼴 스타일, 의미 론적 의미를 지시하는 텍스트가 렌더링되는 시점에 결정되는 (또는 말).

이것을“물리적”글꼴 스타일과“논리적”스타일의 차이로 생각할 수 있습니다. 나중에 스타일 시트에서 속성을 변경하여 색상 및 크기 변경을 추가하거나 다른 글꼴을 사용 <strong>하여 <em>텍스트가 표시 되는 방식 과 텍스트 를 변경하고 싶을 수도 있습니다. 하드 코딩 된 "물리적"마크 업 대신 "논리적"마크 업을 사용한 경우 스타일 시트에서 각각 한 곳에서 표시 속성을 변경하면 해당 스타일 시트를 참조하는 모든 페이지가 자동으로 변경됩니다. . 편집해야합니다.

꽤 매끄럽지 않습니까?

style=단락, 표 셀, 머리글 텍스트, 캡션 등에 대한 하위 스타일 ( 텍스트 태그 의 속성을 사용하여 참조)을 정의하고 사용하는 데 대한 이론적 근거<div> . 스타일 시트에서 논리 스타일의 물리적 표현을 정의 할 수 있으며 해당 스타일 시트를 참조하는 웹 페이지에 변경 사항이 자동으로 반영됩니다. 다른 소스 코드 표현을 원하십니까? "코드"스타일에 맞게 글꼴, 크기, 무게, 간격 등을 재정의하십시오.

XHTML을 사용하는 경우 고유 한 의미 태그를 정의 할 수도 있으며 스타일 시트는 실제 글꼴 스타일 및 레이아웃으로 변환합니다.

실제로이 응답 스레드에 언급 된 이유 때문에 <strong>과 <b>를 모두 사용합니다. 굵은 글씨로 된 텍스트 가 더 좋아 보이는 경우가 있지만, 나머지 문장보다 의미 상 더 중요하지는 않습니다. 다음은 현재 작업중 인 페이지의 예입니다.

"<b> 라크로스 </ b>에 관한 <strong> 모든 </ strong> 도서를 검색합니다."

이 문장에서 "all"이라는 단어는 매우 중요하고 "lacrosse"는 그다지 중요하지 않습니다. 검색 용어를 나타 내기 때문에 굵게 표시하고 싶었 기 때문에 시각적으로 구분하기를 원했습니다. 스크린 리더로 페이지를보고 있다면 "라크로스"라는 단어를 강조 할 필요가 없다고 생각합니다.

대부분의 웹 개발자는 다른 웹 개발자 중 하나를 사용한다고 생각하지만 둘 다 괜찮습니다. 일부 사람들이 주장한 것처럼 <b>는 더 이상 사용되지 않습니다. 저에게는 시각적 호소력과 의미 사이에 훌륭한 선입니다.

CSS 스타일 클래스를 사용하는 것이 어떤 이유로 든 불편하거나 불가능한 경우에만 사용하십시오 (블로그 시스템과 같이 일부 태그 만 게시물 및 내장 스타일에 사용하도록 허용). 또 다른 이유는 매우 오래된 브라우저 (일부 모바일 장치) 또는 기본 검색 엔진 ( CSS 스타일을 분석하는 대신 포인트 <b>또는 <strong>태그 를 제공)을 지원하기 때문입니다 .

CSS 스타일을 정의 할 수 있으면 해당 스타일을 사용하십시오.

<b> 태그를 사용하여 굵게 표시된 텍스트

<strong> 태그를 사용하여 중요한 텍스트

<i> 태그를 사용하는 텍스트 기울임 체 스타일

<em> 태그를 사용하여 강조된 텍스트

<b>그리고 <i>그들이 텍스트의 스타일을 설명하기 때문에 피해야한다. 대신, 사용 <strong>하고 <em>그 텍스트의 의미 (의미)에 대해 설명하기 때문이다.

HTML의 모든 것과 마찬가지로, 원하는 모양 이 아니라 실제로 무엇을 의미 하는지 생각해야합니다 . 물론 대담하고 이탤릭체 일 수도 있지만 화면 판독기는 아닙니다.

b 또는 i 는 텍스트를 굵게 또는 기울임 꼴로 렌더링하려는 것을 의미합니다. strong 또는 em 은 사용자가 "중요한"것으로 이해하는 방식으로 텍스트를 렌더링하려는 것을 의미합니다. 기본값은 이탤릭체처럼 강렬하고 굵게 렌더링되지만 다른 문화권에서는 다른 매핑을 사용할 수 있습니다.

프로그램의 문자열과 마찬가지로 b 와 i 는 "하드 코딩"되고 강력 하고 em 은 "현지화"됩니다.

"그들은 같은 효과를 갖습니다. 그러나 더 깨끗하고 최신 버전의 HTML 인 XHTML은 <strong>태그 사용을 권장합니다 . 읽기 쉬워서 의미가 더 명확하여 강력합니다. 의미가 더 명확합니다. 또한 <strong>텍스트를 보여주는 의미를 전달합니다 . 강하게- <b>(굵게) 메서드를 전달-텍스트를 굵게하기 강력하게, CSS 스타일 시트를 사용하여 텍스트를 강하게 만드는 방법을 변경하는 경우 코드는 여전히 타당합니다.

<i>와 <em>" 의 차이점도 마찬가지 입니다.

구글 딕 시트 :

http://wiki.answers.com/Q/What_is_the_difference_between_HTML_tags_b_and_strong

HTML 형식 요소 :

HTML은 또한 특별한 의미로 텍스트를 정의하기위한 특수 요소를 정의합니다. HTML은 굵은 체 또는 기울임 꼴 텍스트와 같이 출력 형식을 지정하기 위해 <b> 및 <i>와 같은 요소를 사용합니다.

HTML 굵고 강력한 형식 :

HTML <b> 요소는 특별한 중요성없이 굵은 체 텍스트를 정의합니다.

<b>This text is bold</b>

HTML <strong> 요소는 의미 적 "강력한"중요성이 추가 된 강력한 텍스트를 정의합니다.

<strong>This text is strong</strong>

HTML 기울임 꼴 및 강조 형식화 :

HTML <i> 요소는 별다른 중요성없이 기울임 꼴 텍스트를 정의합니다.

<i>This text is italic</i>

HTML <em> 요소는 강조된 텍스트를 의미 적으로 추가하여 정의합니다.

<em>This text is emphasized</em>

일반적으로 <b>및 을 피하려고 노력해야합니다 <i>. 이 font태그 는 CSS를 만들기 전에 초기 HMTL 버전에서 페이지 레이아웃을 표시하기 위해 소개되었습니다 (예 : 제거 된 태그). 주로 이전 버전과의 호환성을 위해 유지되었습니다. 일부 포럼은 인라인 HTML을 허용하기 때문에 텍스트 모양을 변경하는 방법 (BBCode를 사용하는 [i]등 사용 가능 <i>)

CSS를 만든 이후로 레이아웃은 실제로는 더 이상 HTML에서 수행해야 할 작업이 아니므로 CSS가 처음에 생성 된 것입니다 (HTML == 구조, CSS == 레이아웃). span"무의미한"글꼴 변형이 필요한 경우 CSS와 태그를 사용하여 텍스트를 굵게 / 이탤릭체로 만들 수 있습니다. HTML 5는 여전히 그것들을 허용하지만 그런 식으로 텍스트를 표시하는 것은 의미 가 없다고 선언합니다 .

<em>그리고 <strong>다른 한편으로는 단지 그것을 렌더링하는 방법을 브라우저에 완전히 열어 잎, 뭔가가 "강조"또는 "강력하게 강조"하고 있다고 말했습니다. 대부분의 브라우저는 기본적으로 표준에서 제안하는 em것처럼 기울임 꼴로 strong굵게 렌더링 되지만 강제로 수행하지는 않습니다 (다양한 색상, 글꼴 크기, 글꼴 등을 사용할 수 있음). CSS를 사용하여 원하는 방식으로 동작을 변경할 수 있습니다. 예를 들어 굵은 글씨 em를 좋아 하면 굵게 표시 할 수 있습니다 strong.

<strong>그리고 <em>추상적입니다 (사람들이 의미 적이라고 말할 때의 의미입니다). <b>그리고 <i>"강조"뭔가 "강력한"또는 만드는 구체적인 방법은

유추:

둘 다 <strong>이다 <b>와 <em>이다<i>

같이

"차량"은 "지프"입니다

<strong>제품 이름, 회사 이름 등과 같은 SEO 목적에 우선 순위가 높은 텍스트에 태그를 사용 하지만 <b>단순하게 굵게 표시합니다.

마찬가지로, 텍스트를 이탤릭체로 만들기 <em>위해 SEO에 우선 순위가 높은 텍스트를 사용 합니다 <i>.