달리는 자동차
HTML 정리1 본문
<!--HTML의 기본구조-->
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
<!--
<!DOCTYPE html>
HTML5를 사용한다는 의미 (5는 버전을 의미한다.)
<title></title>
웹페이지의 제목을 의미한다. 탭에 제목이 생긴다.
-->|
각 태그는 <태그명>으로 시작하여 </태그명>으로 끝난다. but <img />나 <br /> 태그등과 같은 단독 태그도 있다. |
<head>
<meta charset="UTF-8"/>
<!--
문자셋 - 문서를 작성할 때 이 문서가 어떤 언어를 사용하여 작성하는지 컴퓨터에게 알려주는 역할
"UTF-8" -유니코드 영어, 한글, 일본어, 중국어를 표현해주는 문자셋
-->
<title>탭에 표시<title>
</head>
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
<!--
H태그 주로 글의 제목등에 쓰인다.
태그안의 숫자의 크기가 클수록 글씨의 크기는 작아진다.
-->
<i>이탤릭체</i>
<!--
i태그의 i는 italic(이탤릭)을 의미
-->
<b>두꺼운 글씨</b>
<!--
b태그는 텍스트를 두껍게 할때 사용
-->
<p>문장을 작성할 때 사용한다.</p>
<!--
p태그의 p는 paragraph(문장)을 의미한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>문장</title>
</head>
<body>
<p>바디태그 안에 쓴다.</p>
</body>
</html>
-->
<u>밑줄</u>
<!--
U태그의 u는 underline(밑줄)을 의미한다.
텍스트에 밑줄을 긋고싶을 때 사용
-->
<sub>서브태그</sub>
<!--
sub태그의 sub는 subscript(아래첨자)를 의미.
텍스트를 아래첨자로 표현할 때 사용한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>아래첨자 subscript</title>
</head>
<body>
보통글씨<sub>작은글씨<sub>
</body>
</html>
-->
<sup>서프태그</sup>
<!-- sup태그의 sup는 superscript(위첨자)를 의미한다.
즉 수학에서 지수를 나타낼때 사용, 위로 작게 표시된다. --><strike>취소선 : 가운데 밑줄이 생긴다.</strike>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>취소선 연습<title>
</head>
<body>
<strike>죽고싶다.<strike>
<p>그래도 살아야지.</p>
</body>
</html>
<em>이탤릭2</em>
<!--
효과는 이탤릭효과가 나타난다.
그럼왜 써? 특정 문장이나 단어를 강조할 때 사용한단다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>em태그</title>
</head>
<body>
안녕<em>안</em>하세요.
</body>
</html>
-->
<br />
<!--줄바꿈을 하는태그, line break의 줄임말이다.
단독태그 이므로 <br /> 하고 띄워준다.-->
<hr />
<!--한줄긑는 태그 -->- 잠깐!
<br>만으로도 줄바꿈 기능은 구동하지만, 단독태그에는 /를 붙이기로 약속되어있다.
웹표준검사(validator.kldp.org)에서 웹표준 검사를 하게 되면 단독태그에 /를 안붙였다고 지랄한다. - <br/> <br />의 차이
단지 공백하나 차이, <br />을 쓰는것이 더 호환성이 좋다. 가끔 아주 오래된 브라우저의 경우(넷스케이프)
<br/>태그를 br/로 인식해버린다. 옛날 브라우저와 호환성까지 염두해 둔다면 <br />을 사용하면 된다. 이 br태그는 중요한 코드가 아니므로 br br/ br / 다 써도 될듯하다..
<mark>형광펜기능</mark>
<! DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
</head>
<body>
<p><mark>3월 토끼</mark>는 예쁘다.<p>
</body>
</html>
<!-- 마크태그는
기본적으로 노란색 형관펜을 보여준다.
css기능을 사용하면 형관펜 색을 바꿀수 있다.
-->
<!DOCTYPE html>
<html>
<head>
<meta charterset="UTF-8"/>
<title>핑크형광펜</title>
<style>
mark{background:hotpink}
</style>
</head>
<body>
<p>토끼는 <mark>핑크색</mark>입니다.
</body>
</html>
출처 : 에버디벨님의 소중한 지식을 참고하였습니다. 에버디벨 사이트 : https://www.everdevel.com/HTML/
Comments