HTML(Hyper Text Markup Language)
① 목적 : Display → 내용(글)이 web browser 상에서 어떻게 보여질지 지정,
→web page 작성하기 위한 markup 언어
→문서의 구조, 문서의 display ⇨ CSS(style)
② Element(요소)
<start태그명> 내용 </end태그명>
⇨ 내용 : text, element
<start태그 attribute(속성) =“값” [attr =“value”]
→ attribute : 태그에 속성 추가 정보 명시
ex) <font size=“6” color=“red”> 안녕 </font>
③ HTML : Text, HTML 태그들 → File의 확장자 : .html, .htm
∴ 구성 → 대, 소문자 상관없다.
<HTML> → Root 태그
<HEAD>
</HEAD> ⇨ Page에 대한 설명
<BODY>
</BODY> ⇨ 내용
</HTML>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- <p> 문단(paragraph) 태그
<br>은 Enter
<b>는 bold
<u>는 밑줄
<i>는 이태릭체
<font> : 폰트 관련 설정
attribute : size - 글자크기(1~6 : 3이 기본)
color - 글자색(상수, #RGB)
face - : 글자체, 폰트지정
<ol>,<ul> : 목록태그(ol- 순서가 있는태그, ul-순서가 없는 태그)
sub 태그로 <li>를 가짐 - 목록에 들어갈 item을 지정하는 태그
-->
<p>
<b><u><i><font size="5"> 안녕하세요.. 우리 카페입니다.</font></i></u></b>
</p>
<p>
<font size="4" color="blue">항상 좋은 재료로 맛있는 커피를 제공하도록 노력하겠습니다.</font>
</p>
저희가 제공하는 메뉴<br>
<ul>
<li>아이스 카페</li>
<li>아메리카노</li>
<li>아이스 카페 모카</li>
<li>카페 아메리카노</li>
<li>아이스 캬라멜 마키아또</li>
<li>아이스 카푸치노</li>
<li>바닐라 라떼</li>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- <p> 문단(paragraph) 태그
<br>은 Enter
<b>는 bold
<u>는 밑줄
<i>는 이태릭체
<font> : 폰트 관련 설정
attribute : size - 글자크기(1~6 : 3이 기본)
color - 글자색(상수, #RGB)
face - : 글자체, 폰트지정
<ol>,<ul> : 목록태그(ol- 순서가 있는태그, ul-순서가 없는 태그)
sub 태그로 <li>를 가짐 - 목록에 들어갈 item을 지정하는 태그
-->
<p>
<b><u><i><font size="5"> 안녕하세요.. 우리 카페입니다.</font></i></u></b>
</p>
<p>
<font size="4" color="blue">항상 좋은 재료로 맛있는 커피를 제공하도록 노력하겠습니다.</font>
</p>
저희가 제공하는 메뉴<br>
<ul>
<li>아이스 카페</li>
<li>아메리카노</li>
<li>아이스 카페 모카</li>
<li>카페 아메리카노</li>
<li>아이스 캬라멜 마키아또</li>
<li>아이스 카푸치노</li>
<li>바닐라 라떼</li>
</ul>
<!-- menu.html을 입력하면 intro.html이 있던 경로인 http://127.0.0.1:8088/basic_html/ 의 위치를
기준으로 basic_html/ 하위의 경로에서 menu.html을 참조 -->
<a href="menu.html">메뉴의 자세한 설명</a>
</body>
</html>
'Wanna be a Programmer > Servlet & JSP' 카테고리의 다른 글
| Servlet & JSP day2 - container&component, 개발환경, servlet의 lifecyle eclipse test (0) | 2012.04.18 |
|---|---|
| JSP로 작성한 hello.jsp (0) | 2012.04.17 |
| Servlet 테스트 - HelloServlet.java와 web.xml (0) | 2012.04.17 |
| Servlet 클래스 작성 패턴 (0) | 2012.04.17 |
| HTML Second (0) | 2012.04.17 |
