1) 링크 연습하기
<!DOCTYPE html>
<html>
<head>
<tittle>링크 연습하기</tittle>
</head>
<body>
<h2>나의 취미 소개</h2>
<p>나의 취미는 <strong><디제잉></strong>입니다.</p>
<br>
<p>좋아하는 장르는 R&B를 좋아합니다.</p>
<p>좋아하는 사람들이랑 함께 음악을 틀면서 파티를 하는 것을 좋아합니다.</p>
<br>
<h2>좋아하는 노래 장르</h2>
<ul>
<li><a href="https://namu.wiki/w/R%26B">R&B</a></li>
</ul>
<hr>
<h2> 디제잉 배우기</h2>
<embed width="560" height="315" src="https://youtu.be/QlaKv4jQXq0" frameborder="0" allow="accelerometer;autoplay;encrypted-media;gyroscope;picture-in-picture" >
</body>
</html>
- <a>요소를 활용해서 링크 연결
-<embed> 요소를 활용해서 유튜브 영상 삽입
2) 문서내 링크 사용하기
<!DOCTYPE html>
<html>
<head>
<tittle>문서 내 링크 연습하기</tittle>
</head>
<body>
<h2>음악 장르 소개</h2>
<p>목차</p>
<ul>
<li><a href="#music001"> R&B</a></li>
<li><a href="#music002"> 하우스</a></li>
</ul>
<a id="music001"></a>
<h3>R&B<h3>
<p>음악 장르 중 하나로 리듬 앤 블루스(rhythm and blues)의 약자. 1940년대 말 1950년대 초에 미국의 흑인들 사이에서 가스펠, 블루스에 댄스풍 재즈 리듬이 섞여 탄생한 음악 장르이다.</p>
<a id="music002"></a>
<h3>하우스<h3>
<p>4/4박자의 정박자 비트를 기반으로 하는 장르로 70년대 유행하던 디스코 이후로 당시 마약과 함께 클럽에서 문제가 되던 디스코에 대한 저항운동 'Disco Sucks' 가 생겨남에 따라 80년대 디스코음악이 듣기 힘들어질 즈음에 어느 시카고의 게이들이 주로 있던 클럽에서 디제잉을 하던 프랭키 너클즈에 의해 유래되었다.</p>
</body>
</html>
- <a> 요소를 사용해서 목차를 클릭하면 해당 내용으로 이동
- id 를 사용할 때 <a href ="#music001"> 링크에 #을 붙인것을 알 수 있다.
3) 오디오/비디오 삽입하기
4) <iframe>이용하기
'Front-end > Web' 카테고리의 다른 글
JavaScript 기초 (사칙연산,switch,for,while,if-else) (0) | 2020.09.05 |
---|---|
다양한 입력폼 <form> (0) | 2020.09.05 |
고급표현을 위한 CSS 활용 (0) | 2020.09.05 |
CSS3 스타일시트 기초 (0) | 2020.09.05 |
HTML 문서의 기본 (0) | 2020.09.05 |
댓글