- 주석 : 코드의 내용을 설명 / 유지보수, 인수인계 시 중요함
- HTML :<!-- 코멘트할 내용 -->
- CSS : /* 코멘트할 내용 */
- Javascript // 코멘트할 내용 //
- 줄바꿈 태그
- <br> (new line) : 내용<br> / 닫히는 태그 없음
- <p> (paragraph) : <p>내용</p>
- 이미지 넣기 : img태그 & 속성(attribute) - img태그 만으로 이미지 정보가 부족할 때, 속성을 이용해 추가정보를 가져 온다. / 속성: src, width 등
- <img src="image/cafe.jpg" width="100%">
- src : 이미지 파일 url / alt : 출력할 수 없는 경우 출력되는 문자열 / width : 폭 / height : 너비
- 리스트 태그
- 순서 없는 리스트 태그(unordered) : <ul>,</ul> / <li>, (</li>)
- 순서 있는 리스트 태그(ordered) : <ol>,</ol> / <li>
- 정의 리스트(definition) : <dl>,</dl> /<li>
<ol> or <ul>
<li>Html</li>
<li>CSS</li>
<li>JavaScript</li>
</ol> or <ul>
- <title> : 웹 페이지의 제목을 표시해주는 태그/ 검색엔진들은 title태그를 책 표지처럼 인식
- <meta> : 메타 데이터(데이터를 설명하는 데이터) 태그 / <head> 태그 안에 작성 / 저작자, 인코딩, 키워드 등
- <meta charset='utf-8'> : utf-8 형식으로 문서를 읽으라는 뜻 / 디자인에 영향 x , 문서 자체의 특성을 담음'
- <head> : 해당 문서에 대한 정보인 메타데이터의 집합을 정의할 때 사용
- <body> : 문서 본문을 표시하는 태그
<head>
<title>WEB1 - html</title>
<meta charset="utf-8">
</head>
<body>
<ul>
<li>HTM</li>
<li>CSS</li>
<li>javascript</li>
</ul>
</body>
- a 태그 : url 링크를 만드는 태그, Hypertext를 상징
- 레이아웃 표시 태그 : 웹 페이지에 레이아웃을 구성하고, 영역을 설정
- <div> : 줄 바꿈 가능
- <span> : 옆으로 붙음
<!DOCTYPE html>
<html>
<head><title><div>블록과 <span>인라인</title></head>
<body>
<h3>사랑</h3>
<hr>
<div style="background-color:skyblue; padding:20px;">
내가 사람의 방언과 천사의 말을 할지라도
<span style="color:red">사랑</span>이 없으면
소리 나는 구리와 울리는 꽹과리가 되고,
<span style="color:red">사랑</span>이 없으면 아무
것도 아니라.
</div>
<p>
~우리 서로 사랑하며 살아요~
</p>
</body>
</html>
- <hr> : 수평선 긋기 - 종료 태그 x
- <pre></pre> : 개발자의 포맷 그대로 출력 - 엔터, 탭 등
- 텍스트 꾸미기
- <h1~h6> : 제목과 크기
- <b> : 진하게, <strong> : 강조, <em>: 강조, <i> : 이탤릭, <mark> : 하이라이팅
- <small> : 한단계 작은 문자
- <del> : 삭제, <ins> : 추가
- <sup> : 윗첨자, <sub> : 아래첨자
<!DOCTYPE html>
<html>
<head><title>텍스트 꾸미기</title></head>
<body>
<h3> 텍스트 꾸미기</h3>
<hr>
<p>
<b>진하게</b><br> <- bold
<strong>중요한</strong>
<em>강조</em><br> <- emphasize
<i>이탤릭으로 강조</i><br> italic
<b><i>진하게 이탤릭으로 강조</i></b><br>
보통 문자 <small>한 단계 작은 문자</small><br>
<del>삭제</del><br>
<ins>추가</ins><br>
보통문자의 <sup>윗첨자</sup><br>
보통문자의 <sub>아래첨자</sub><br>
<mark>하이라이팅</mark><br>
</p>
</body>
</html>
- <base> : 웹 페이지들의 기본URL과 페이지가 출력될 윈도우 지정
<a href="http://www.mysite.com/score/math.html">수학</a>
<a href="http://www.mysite.com/score/science.html">과학</a
같은 주소에 있는 경우 -> 수정가능
<head>
<base href="http://www.mysite.com/score/">
</head>
<head>
<base href="http://www.mysite.com/score/">
</head>
- <link> : 외부 자원 연결에 사용
- <link type = "text/css" rel="stylesheet" href="mystyle.css">
