03. 웹 콘텐츠를 담는 태그
· 텍스트 태그
텍스트를 저장할 때 사용하는 태그 : h1~h6 (타이틀), p(문단)
- 중요도에 따라 가장 중요한 타이틀을 h1에 저장함
<p>텍스트를 저장할 때 사용하는 태그는 h1 ~ h6, p 태그이다.</p>
· 이미지 태그
이미지를 저장할 때 사용하는 태그 : img
- 필수 속성 src를 이용해 이미지를 html 문서에 포함 시킨다. ( 상대 or 절대 경로를 부여함 )
- 상대 경로 : 내가 작성하는 파일의 위치에서 경로가 시작하는 것 ( none, ./, ../ ) ( / : 해당 파일 하단으로 이동)
절대 경로 : 루트 디렉터리에서 경로가 시작하는 것 (
- 필수 속성이 아닌 alt를 이용해 이미지에 대한 설명을 작성, 웹 접근성을 향상시키기 위해 웹 표준에서는 권장
<img src="./joayong.png" alt="조아용"> // 상대 경로 <!-- none, ./, ../ : 상대경로 -->
<img src="images/joayong_hate.jpg" alt="하기시러용"> // 상대 경로 <!-- (슬래시 / : 해당 파일 하단으로 이동하는 뜻) -->
<img src="../../imgs/joayong_back.png" alt="조아용뒷태"> // 상대 경로 <!-- ../ : 현재 파일 위로 이동하는 뜻 (이동하는 횟수대로 반복)-->
<img src="D:/오선영/{01.HTML5}/joayong.png" alt="조아용"> // 절대 경로
<img src="/오선영/{01.HTML5}/joayong.png" alt="조아용"> // 절대 경로 <!-- / 시작 : 웹서버의 절대경로 -->
· 비디오 태그
동영상 저장할 때 사용하는 태그 : video
<video autoplay preload controls loop muted>
- 자동재생/자동불러오기/동영상진행바표시/무한반복/음소거
- preload 없으면 사용자가 재생 버튼 눌렀을때 불러오기 시작함
· 오디오 태그
오디오 저장할 때 사용하는 태그 : audio
<audio autoplay preload controls loop muted>
'국비지원 JAVA 풀스택 과정 > HTML+CSS3' 카테고리의 다른 글
[HTML+CSS3] CSS3 스타일 (0) | 2022.09.22 |
---|---|
[HTML+CSS3] 추가 입력 양식 태그 (HTML) (2) | 2022.09.21 |
[HTML+CSS3] 하이퍼링크 (2) | 2022.09.19 |
[HTML+CSS3] HTML 기본문서 개념 (0) | 2022.09.16 |
[HTML+CSS3] 개발자 환경 구축 (0) | 2022.09.15 |