● HTML
: HTML을 생성하면 기본적으로 완성되는 소스입니다.
<html> 은 "저는 html입니다"라고 알리는것과 같습니다. 주로, 설정값들이 많이들어갑니다.
<head> 는 제목이다. 여기서 <title>이라는 태그사용했습니다.
<body> 는 내용이 들어가는곳입니다.
<meta charset="UTF-8">에서 meta란 회사별(익스플로러,크롬 등)로 브라우저에서 읽어들이는게 전부 다르기때문에 이것을 번역 처리해주는것입니다.
예시)
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
</body>
</html>
● 주석이란?
: 로직에 대한 설명이나 코드를 비활성화 할때 사용한다.
프로그래밍적으로 해석되지않는다.
사용방법 : <!-- -->
(아래 소스에서 " <!-- 내용이 들어가는 곳 -->"이런식으로 실습해봤습니다.)
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<!-- 내용이 들어가는 곳--> <------주석표현방식
<h1>h1 : 문서의 주 제목</h1>
<h2>h2 : 문서의 내용 & 부 제목</h2>
<h3>h3 : 문서의 내용 & 부 제목</h3>
<h4>h4 : 문서의 주 제목</h4>
<h5>h5 : 문서의 주 제목</h5>
<h6>h6 : 문서의 주 제목</h6>
</body>
</html>
<!-- 내용이 들어가는곳 --> 이렇게 입력된건 주석을 표현하는 방식입니다.
<h>태그는 제목을 사용할때 쓰는 태그이고, 자동으로 다음줄로 이동합니다.
1~6까지 있으며, 숫자가 작을수록 글자크기가 커집니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<font size="1">글씨 크기 1</font><br>
<font size="2">글씨 크기 2</font><br>
<font size="3">글씨 크기 3</font><br>
<font size="4">글씨 크기 4</font><br>
<font size="5">글씨 크기 5</font><br>
<font size="6">글씨 크기 6</font><br>
<font size="7">글씨 크기 7</font><br>
<font size="7" color="blue" face="궁서체">글씨 크기 7</font><br>
<h6 style="background-color: yellow">글씨 크기 7 </h6><br>
<font size="7" style="background-color: yellow">글씨 크기 7 </font><br>
</body>
</html>
<font>태그는 글자의 크기를 나타내고, 자동으로 다음줄 이동이 안되기때문에 <br>을 사용했습니다.
<br>태그는 다음줄로 이동하는 일종의 "Enter" 입니다.
color는 글자색변경이고, face는 글씨체변경입니다.
background-color는 글자뒷배경을 변경해줍니다.
이때, <h>태그와 <font>태그에서 background-color을 사용해도 다르게 나타나는 이유는 <h>태그는
사용후, 다음줄로 이동한다했듯이 한줄이 모두 포함이 됩니다.
하지만, <font>태그는 사용한 글자수만큼만 해당하므로, 글자만 color가 들어갑니다.
'Dev. Front-End > HTML' 카테고리의 다른 글
| [HTML] ul / li / ol / dl / dt / dd 사용법 (0) | 2019.08.08 |
|---|---|
| [HTML] img태그 (이미지넣기) 사용법 (0) | 2019.08.07 |
| [HTML] a태그 (주소 링크 달기) 사용법 및 속성 (0) | 2019.08.06 |
| [HTML] table / caption / tr / td / th / colspan / rowspan / cellpadding / cellspacing 테이블만들기 (0) | 2019.08.05 |
| [HTML] dfn/ strong / strike / b / i / u / center / sup / sub / br / p / pre / hr 사용법 (0) | 2019.08.03 |
| [HTML] Problem Occurred('Starting Tomcat v8.0 Server at localhost' has encountered a problem) 에러 해결 (0) | 2019.08.02 |
| [HTML] 아톰(atom)설치방법 및 설정 & 출력해보기 (무료 웹 에디터) (1) | 2019.08.01 |
| [HTML] html의 개념과 설치&사용방법 ( 아파치 톰캣 다운로드 / 설치방법 ) (0) | 2019.08.01 |
