<h1>~<h6> - 문서의 제목 지정하기
- <h1>~<h6>태그는 제목 태그로 숫자가 커질수록 제목의 중요도가 떨어짐
<body>
<h1>제목1</h1>
<h2>제목2</h2>
<h3>제목3</h3>
<h4>제목4</h4>
<h5>제목5</h5>
<h6>제목6</h6>
</body>
<p> - 문단 지정하기
- <p>태그는 문단 태그로 문장 여러 개를 문단으로 지정
<body>
<p>
Lorem ipsum, dolor sit amet consectetur adipisicing elit.
Optio, beatae! Fugit, quisquam. Repellendus laboriosam ex nam amet,
dolore corrupti optio assumenda quasi tempora consectetur,
sequi totam dolorum molestias minima aliquid.
</p>
</body>
<div> - 콘텐츠 그룹화하기
- <div>태그는 그룹 지정 태그로 콘텐츠를 그룹화
<body>
<div>
<h1>Lorem ipsum dolor sit amet.</h1>
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
Nostrum obcaecati ratione iusto sint dolorum architecto deleniti libero velit id temporibus.
</p>
<p>
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Reprehenderit earum voluptas inventore dolore omnis itaque consequuntur, doloribus repellendus eos ullam quas?
</p>
</div>
</body>
<strong>, <em> - 특정 단어 강조하기
- <strong>, <em>태그는 강조태그로 특정 문장이나 단어를 강조하고 싶을때 사용
- <strong> 은 굴게 나타나고 <em>은 기울어져서 나타남
<body>
<p>
<strong>Lorem </strong> ipsum <em>dolor</em> sit amet.
</p>
</body>
<a> - 웹 페이지에 링크 연결하기
- <a> 태그는 링크태그로 페이지를 이동하는 링크를 설정
<body>
<a href="http://www.naver.com">네이버</a>
</body>이러면 현재 열린 웹 브라우저 탭이 네이버 웹페이지 로 이동
<body>
<a href="http://www.naver.com" target="blank">네이버</a>
</body>새로운 탭을 열어서 링크 이동하려면 target="blank" 을 추가
<span>- 인라인 요소 태그 그룹화하기
- <span>태그는 그룹화 태그로 인라인 요소를 그룹화
- <div>태그는 모든 요소를 그룹화 가능하지만 <span>태그는 인라인 요소만 그룹화 가능
<body>
<span>
<strong>네이버</strong>와 <em>구글</em>은 검색서비스입니다.
</span>
</body>
<img> -문서에 이미지 삽입하기
- <img>태그는 이미지 태그로 이미지를 삽입
- src, alt 속성이 필요
- src속성은 이미지 파일의 경로를 지정
- alt속성은 이미지의 설명을 지정
- <img>태그는 닫는 태그가 없으며 마지막에 /를 입력
<body>
<img src="img/rose.jpg" alt="장미" />
</body>
<br> -강제 줄 바꿈 구현하기
- <br>태그는 줄 바꿈 태그로 강제로 줄을 바꿈
<body>
<p>
안녕하세요.
반갑습니다.
</p>
<p>
안녕하세여.<br>
반갑습니다.
</p>
</body>
'FE > 인터렉티브 웹' 카테고리의 다른 글
| 폼 태그 - 사용자 정보 입력받기 (0) | 2023.09.18 |
|---|---|
| 목록 태그 - 메뉴를 깔끔하게 정리하기 (0) | 2023.09.18 |
| 시맨틱 태그 - 웹 페이지 구조 나누기 (0) | 2023.09.18 |
| HTML 파일 둘러보기 (0) | 2023.09.17 |
| 웹 페이지의 필수 재료 (0) | 2023.09.17 |