HTML tag 개념

2729 단어 taghtmlhtml

HTML 문서 태그

자주 사용되는 태그들

<h1> 누구나 아는 그 제목 태그 </h1>
실행결과

제목 태그 1

<p> p태그와
  <br /> br태그
</p>

실행결과

p태그 예시문이라기엔 예시문이 빈약하다 그래서 찾아본 div와 p태그
[p안에div넣지마세요]

<hr /> hr태그
실행결과


~~div태그는 p태그와 마찬가지로 블록라인 요소

div는 블록라인 요소이다
~~

<pre> pre태그 </pre>
실행결과

 자유롭게      공백 사용 가능 

<b> b태그 </b>
실행결과
b태그는 볼드체

<strong> strong 태그 </strong>
실행결과
b태그와 같이 볼드체, 강의에서는 실무에서 strong을 더 쓴다고 하는데 겪어보지 못한 미지의 영역이라 익혀두고 나중에 놀라지 말자

<i> i 태그 </i>
실행결과
i 태그으으으으

<em> em 태그 </em>
실행결과
i태그와 같이 이탤릭체 이것도 실무에서 더 쓰인다는데 나중에 놀라지 말자2


<small> small 태그 </small>
실행결과
스몰태그, 글씨를 작게 만듦, 덧붙임에 주로 사용된다는데 폰트 지정과 차이는 무엇일까

<sub> sub 태그 - 위 첨자 </sub>
실행결과
a2

<sup> sup 태그 - 아래 첨자 </sup>
실행결과
b2

<ins> ins 태그 - 밑줄 </ins>
실행결과
밑줄 확인

<del> del 태그 - 취소선 </del>
실행결과
취소선

<mark> mark 태그 - 하이라이트 </mark>
실행결과
하이라이트 강조



a태그는 anchor의 약자

여기서 중요한 속성은 alt 속성이다.
alt는 대체 텍스트는 HTML의 이미지에 추가되어 웹페이지의 내용과 컨텍스트를 설명한다. 미디어 파일을 제대로 로드하지 못해 표시할 수 없는 경우 대체 텍스트가 이미지 컨테이너에 나타난다.
대체 텍스트는 시각 장애가 있는 사용자와 같은 스크린 리더를 사용하는 사람들이 웹사이트의 내용을 이해하도록 도와준다. 또한 검색엔진 봇이 사이트를 크롤링하고 색인을 생성해 순위를 지정할 때 이미지를 해석하는 데 사용되며 웹 접근성에 중요한 요소이다.
참조사이트-ALT태그가뭐지?

강의에 나온 태그들은 이걸로 정리 끝, 나머지 태그들은 필요할때 w3school 참조
del태그 제외 취소선은 포스트 게시 후 미적용 확인하여 취소선 처리함 미리보기에서는 잘 적용되는 태그가 포스트 작성 후 미적용되는 이유는 무엇일까...

*포스트의 사진은 한국정보교육원 온라인 강의 웹 표준에 맞는 HTML5에서 캡처했습니다.

좋은 웹페이지 즐겨찾기