HTML로 텍스트를 굵게 만드는 방법

작가: Bobbie Johnson
창조 날짜: 7 4 월 2021
업데이트 날짜: 26 6 월 2024
Anonim
텍스트 파일로 전자책 만들기
동영상: 텍스트 파일로 전자책 만들기

콘텐츠

HTML 마크업 언어를 사용하면 문제 없이 한 번에 여러 가지 방법으로 텍스트를 굵게 만들 수 있습니다. 그러나 CSS 스타일 시트의 기본 규칙을 몇 분 동안 공부하고 나중에 작업할 수 있도록 문서에 추가하면 더 좋습니다. 결론은 굵게 강조 표시해야 하는 경우를 포함하여 CSS에서 웹 페이지의 모양을 제어하는 ​​것이 훨씬 더 쉽다는 것입니다.

단계

방법 1/2: HTML로 굵은 텍스트 만들기

  1. 1 강한> 강한 / 강한> 태그를 사용합니다. HTML5에서 사양에 따르면 이것이 텍스트를 강조 표시하는 가장 좋은 방법입니다. 이 태그는 거의 항상 텍스트를 굵게 만듭니다.
    • 강조 표시하려는 텍스트를 태그 안에 배치합니다: strong>바로 여기에/ 강하다>.
  2. 2 적절한 경우 제목을 사용하십시오. 일반적으로 페이지 상단이나 새 섹션의 시작 부분에 배치됩니다. 기본적으로 제목은 일반 텍스트보다 크고 굵게 표시되지만 여기에도 약간의 미묘함이 있습니다. 1에서 6까지 6단계의 제목이 있습니다: h1> - h6>. 사용 시 다음 지침을 따르십시오.
    • h1 머리글은 h1> 첫 번째 수준 머리글 / h1>과 같이 작성되며 페이지의 가장 중요하고 가장 큰 머리글입니다.
    • h2> 표제 h2 / h2> - 두 번째로 중요한 표제에 대해 h6> 표제 h6, 모두 / h6> 중 가장 작은 것까지 계속됩니다.
    • 페이지의 내용을 구성하기 위해서만 적절하게 제목을 신중하게 사용해야 합니다. 사용자는 원하는 콘텐츠가 아래에 있는지 이해하기 위해 최대한 빨리 제목을 볼 수 있어야 합니다.
    • 부제목을 만들 때 한 번에 한 단계씩만 내려가는 것이 좋습니다. 즉, h1> 바로 뒤에 h3>를 붙일 필요가 없습니다. 이렇게 하면 다른 형식으로 변환할 때 페이지 형식이 실패하지 않습니다.
  3. 3 b> 최후의 수단으로 b / b> 태그를 사용하십시오. b> 태그는 여전히 HTML5에서 지원되지만 훨씬 더 좋습니다. 예를 들어 키워드나 어휘 단어, 제품 이름 등을 강조 표시하기 위해 텍스트가 문체적이고 의미론적이지 않은 목적으로 강조 표시된 경우 b>를 사용할 수 있습니다.
    • 대부분의 태그와 마찬가지로 b>는 그 안에 배치되는 / b> 텍스트를 제어하는 ​​쌍입니다.

방법 2/2: CSS로 굵은 텍스트 만들기

  1. 1 CSS를 사용할 때를 기억하십시오. CSS는 페이지의 모양을 편집하기 위한 매우 강력하고 편리한 도구입니다. 실제로 CSS는 페이지의 "모양"이고 HTML은 "의미"입니다. 물론 HTML 태그에는 아무런 문제가 없습니다. 태그를 사용할 수는 있지만 CSS로 작업하는 것이 더 좋습니다. 텍스트 모양을 더 잘 제어할 수 있습니다.
    • 다른 브라우저에서 간단한 HTML 페이지를 엽니다. 각각에서 어떻게 약간 다르게 나타나는지 알 수 있습니까? CSS는 이러한 차이를 최소화하는 데 도움이 될 수 있습니다.
  2. 2 텍스트에 span> 태그를 추가합니다. 아직 CSS를 소유하지 않은 경우 원하는 경우 소위 "인라인 CSS" - "인라인 스타일 시트"로 시작해야 합니다. 물론 이것은 p> 또는 h1>과 같은 태그의 모양을 변경하는 데 사용할 수 있지만 때로는 태그에 아직 포함되지 않은 텍스트를 변경할 수도 있습니다. span> / span> 태그는 그 자체로 효과나 효과가 없지만 페이지에 필요한 변경을 할 수 있는 기회를 제공하는 래퍼와 같습니다. 다음은 예입니다.
    • span> 인라인 CSS로 텍스트를 굵게 만드는 방법을 배우고 있습니다./span>
  3. 3 스타일 속성을 추가합니다. HTML의 속성은 체크박스> 오른쪽 태그에 직접 작성됩니다. CSS를 HTML 태그에 삽입하려면 style 속성이 필요하므로 삽입하십시오. 스타일 = span 태그에서:
    • span style => 인라인 CSS를 사용하여 텍스트를 굵게 만드는 방법을 배우고 있습니다../ span>
    • 스타일 자체를 추가하지 않는 경우 스타일 속성을 추가하는 이유는 무엇입니까? 올바르게 생각하십시오. 그러나 여기에서 우리는 모든 것을 단계별로 설정하고 있습니다!
  4. 4 font-weight 속성을 추가합니다. CSS 속성은 속성의 일부로 추가되며, 이 경우에는 "font-weight"(리터럴 가중치)라는 스타일 속성의 일부로 추가됩니다. 이 속성은 굵게뿐만 아니라 extra-bold, thin, normal 등의 글꼴 스타일을 지정하는 데 사용할 수 있습니다. = 기호 뒤에 씁니다. "글꼴 두께:"... 다음과 같이 표시되어야 합니다.
    • span style = "font-weight:"> 인라인 CSS를 사용하여 텍스트를 굵게 만드는 방법을 배우고 있습니다 ../ span>
    • 지금은 일시 중지하고 다른 것은 작성하지 마십시오(예, 앞으로 더 있을 것입니다).
    • 앞뒤에 따옴표를 넣는 것을 잊지 마십시오. 글꼴 두께:.
  5. 5 굵은 값을 추가합니다. 뭐가 남았어? 맞습니다. 속성 속성을 값으로 설정하십시오! 어디에 삽입할까요? 맞아요 사이 글꼴 두께: 그리고 닫는 인용문. 이 속성에는 굵기가 다른 여러 종류가 있으며 가장 쉬운 방법은 값을 사용하는 것입니다. 굵게:
    • span style = "font-weight: bold"> 인라인 CSS를 사용하여 텍스트를 굵게 만드는 방법을 배우고 있습니다./span>
  6. 6 다른 값으로 실험하십시오. CSS는 HTML보다 훨씬 강력하므로 손과 발이 묶인 것처럼 느끼지 마십시오. 다음은 볼드체에 대한 몇 가지 대안입니다.
    • span style = "font-weight: bolder"> "Bolder" - 이렇게 하면 텍스트가 아무리 굵게 표시되더라도 항상 상위 요소보다 두꺼워집니다. / span> 전체 단락이 "bold"로 선택되면 "bolder"는 그 안에 있는 별도의 문장을 더욱 대담하게 강조하는 데 도움이 됩니다.
    • span style = "font-weight: normal"> "Normal" - 이러한 텍스트는 텍스트를 굵게 만드는 태그 내부에서도 평소와 같이 보입니다. / span>
    • span style = "font-weight: 900"> 텍스트의 두께를 설정하려면 100에서 900 사이의 값을 사용할 수 있습니다. 400 - 일반 스타일, 굵게 - 700 이상에서 / span>

  • CSS에서 가중치에 숫자 값을 사용할 때 100의 배수를 사용합니다. 다른 모든 값은 계속 반올림됩니다.
  • 확실히 외부 CSS 파일은 이 기사에서 설명한 것보다 훨씬 더 편리합니다. 이렇게 하면 한 파일에서 한 번에 사이트의 모든 페이지 모양을 제어할 수 있습니다!
  • 타이포그래퍼가 원래 의도한 것보다 글꼴을 더 두껍게 만들 수는 없습니다. CSS로 작업할 때 글꼴이 표준에 따라 변경된다는 점을 기억하십시오. 따라서 두 개의 굵은 글꼴 옵션 간의 차이를 볼 수 없습니다(더 정확하게는 볼 수 있지만 글꼴에 따라 다름).