DEV/html
sample3
purple
2020. 1. 8. 19:09

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<video width = "400" controls = "controls" loop = "loop">
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
</video>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type = "text/css">
.cls li { /* .(도트)는 클래스임 즉 .(클래스) cls 의 list 를 의미함*/
display: inline; /* 리스트를 가로 모드로 맨 아래 보면 있음 */
}
</style>
</head>
<body>
<!-- list -->
<ul> <!-- ul 이란 unordered list 즉 순서없는목록을 의미 -->
<li> 순서없는 목록 </li>
<li> tea </li>
<li> milk </li>
</ul>
<!-- 동그란 기 -->
<ul style = "list-style-type : disc">
<li> coffee </li>
<li> tea </li>
<li> milk </li>
</ul>
<!-- 네모기호-->
<ul style = "list-style-type : square">
<li> coffee </li>
<li> tea </li>
<li> milk </li>
</ul>
<!-- 기호 없음 -->
<ul style = "list-style-type : none">
<li> coffee </li>
<li> tea </li>
<li> milk </li>
</ul>
<ul style = "list-style-type : disc">
<li>
<a href = "#"> coffee</a>
</li>
<li> tea </li>
<li> milk </li>
</ul>
<!-- ordered list 순서가 있는 목록 (1,2,3, ... 숫자가 매겨진다) -->
<ol>
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<ol type = "2"> <!-- type 숫자에 뭐가 들어가든 실질적인 차이가 없다. -->
<li> apple2 </li>
<li> pear2 </li>
<li> banana2 </li>
</ol>
<!-- HTML5 에서 바뀐내용으로 이걸 더 쓴다. start에 들어가는 숫자부터 시작하는 목록임. 1이면 1부터 시작, 2면 2부터 시작함 -->
<ol start = "1">
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<ol start = "2">
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<!-- A부터 시작 -->
<ol type = "A">
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<!-- 로마자 숫자 -->
<ol type = "I">
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<!-- 로마자숫자 소문자 -->
<ol type = "i">
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
<li> apple </li>
<li> pear </li>
<li> banana </li>
</ol>
<!-- list 안의 list. unordered list 든 ordered list 든 어떤것이 밖에 오고 안에오는지는 쓰는사람 마음임 둘다 가능 -->
<ul>
<li> coffee
<ol>
<li> 블랙커피 </li>
<li> 밀크커피 </li>
</ol>
</li>
<li> tea </li>
<li> milk </li>
</ul>
<!-- 가로모드 리스트. 단, 가로모드로 할때는 숫자넘버링이 안나오므로 직접 써줘야한다..ㅎㅎ.. -->
<br>
<p> 좋아하는 과일은 ? </p>
<ol class = "cls">
<li> 1. apple </li>
<li> 2. pear </li>
<li> 3. banana </li>
</ol>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
/* iFrame 이란? : web page in web : 웹 페이지 안의 웹 페이지 */
<h3> index1 </h3>
<iframe src = "index.html" width = "400" height = "300"> </iframe>
<iframe src = "http://www.nate.com" width = "400" height = "300"></iframe>
<br>
<iframe src = "www.youtube.com" width = "400" height = "400"> </iframe> <!-- 서버의 문제로 안나오는것 코드는 맞음 -->
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body bgcolor = "#000000" text = "#ffffff">
<div align = "center">
<h1> 타히티 사진 </h1>
다음 사진을 클릭하면, 확대 사진을 볼 수 있습니다.
<br><br>
<a href = "./images/tahiti01.jpg" target = "photo">
<img alt = "" src = "./images/tahiti01s.jpg">
</a>
<a href = "./images/tahiti02.jpg" target = "photo">
<img alt = "" src = "./images/tahiti02s.jpg">
</a>
<a href = "./images/tahiti03.jpg" target = "photo">
<img alt = "" src = "./images/tahiti03s.jpg">
</a>
<a href = "./images/tahiti04.jpg" target = "photo">
<img alt = "" src = "./images/tahiti04s.jpg">
</a>
<a href = "./images/tahiti05.jpg" target = "photo">
<img alt = "" src = "./images/tahiti05s.jpg">
</a>
<br><br><br>
<iframe src = "./images/tahiti01.jpg" width = "400" height = "266" name = "photo">
</iframe>
</div>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<video width = "400" controls = "controls" loop = "loop">
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
</video>
</body>
</html>