2020/12/31 - [자바 프로그래밍] - [Spring 기반 자바(Java) 융합 개발자 2차] 1차 테스트 풀이
2020/12/31 - [자바 프로그래밍] - [Spring 기반 자바(Java) 융합 개발자 2차] 2차 테스트 풀이
2020/12/31 - [자바 프로그래밍] - [자바 기초] 13일차 일지 1 - 화면(UI)구현(Ch.1 웹 프로그래밍의 개요)
2020/12/31 - [자바 프로그래밍] - [자바 기초] 13일차 일지 2 - 화면(UI)구현(Ch.2 웹 프로그래밍 실습 환경 구축)
브라켓 설치하기
- brackets.io에서 설치
다운로드가 완료되면 따로 자동 실행이 되지 않고 Windows 키를 누르면 최근 추가한 앱에서
Brackets를 찾으면 된다
실행화면
현재 파일에
index.html이 있고
폴더 -> 파일1, 파일2, 파일3, a.html ..
우리는 폴더를 1개 만들고 그 안에다 파일을 넣을 것
C드라이브에 'html_test' 폴더를 하나 만든다
폴더 선택을 하면 폴더가 열린다
html_test 폴더 안에
아래와 같은 이름의 파일을 만든다
ex1.html
ex2.html
<html>
<head>
</head>
<body>
<h1>안녕하세요</h1>
</body>
</html>html 기본 구조
chrome이 깔려있다면 저 번개 모양을 누르면
이렇게 뜨는데 번개 모양이 회색에서 노란색으로 바뀌고
오른쪽 창에는 실시간으로 내가 입력해주는 대로 자동 반영이 되어 보인다.
목차
01 HTML5 문서의 구조
02 HTML5 문서의 작성 규칙
03 태그의 분류
04 태그의 속성
05 웹 문서의 레이아웃
01 HTML5 문서의 구조
1. HTML5 문서의 구조
<!DOCTYPE html>
HTML5 문서를 선언하는 구문
생략할 수 있지만 하위 호환성을 위해 작성할 것을 권장
<html> ~ </html>
HTML5 문서의 시작과 종료를 알림
언어(lang) 속성을 사용하여 주된 언어 값을 설정할 수 있음
<head> ~ </head>
웹 페이지의 정보를 정의
<title> 태그와 자바스크립트, 스타일시트(CSS) 등을 정의
<body> ~ </body>
HTML5 문서의 본문을 작성
예제 3-1 기본 태그로 웹 문서 작성하기 ch03/01_intro.html
<!DOCTYPE html>
<html>
<head>
<title>HTML5 시작</title>
</head>
<body>
HTML5 기본 태그를 사용하여 작성한 문서입니다.
</body>
</html>
예제 3-2 메타정보를 정의한 웹 문서 작성하기 ch03/02_head.html
<!DOCTYPE html>
<html>
<head>
<title>HTML5 메타정보</title>
<meta charset="UTF-8">
<meta name="author" content="Hong Seong Yong">
<meta name="keywords" content="HTML5, CSS3, JavaScript, JQuery">
<meta name="description" content="Web Programming">
<meta http-equiv="refresh" content="10, http://cafe.naver.com/go2web">
<base href="http://www.w3.org/" target="_blank">
</head>
<body>
<p>헤드 태그 내 메타정보에는 웹 문서를 만든 이, 검색 시 키워드, 문서에 대한 설명, 문서 내 기본 디렉터리 등이 포함됩니다.</p>
<p>이 문서는 10초 후 저자 카페로 이동합니다.</p>
<a href="">여기를 클릭하면 기본 디렉터리로 설정된 www.w3.org 사이트로 이동합니다.</a>
</body>
</html>< > -> 꺽쇠가 열고, 닫고 한 쌍으로(pair) 존재
<title> </title> -> 태그 -> Element(구성요소)
<title name = "제목"> 이런 식으로 태그 옆에 속성(Property)을 적어줄 수 있다
ㄴ> 속성(Property)
<meta charset="UTF-8"> -> meta라는 Element에는 charset이라는 속성이 들어있고 속성 값은 UTF-8이다
ㄴ> 속성값
cf) DB에서의 속성은 Attribute라고 함
모두들 새해 복 많이 받으세요~!
'프로그래밍 > 자바(java) 융합개발자 2차' 카테고리의 다른 글
| [자바 기초] 14일차 일지 2 - 화면(UI)구현(Ch4. 기본 태그) (0) | 2021.01.04 |
|---|---|
| [자바 기초] 14일차 일지 1 - 화면(UI)구현(Ch3. HTML5 문서 구조와 작성 규칙, 예제 실습) (0) | 2021.01.04 |
| [자바 기초] 13일차 일지 2 - 화면(UI)구현(Ch.2 웹 프로그래밍 실습 환경 구축) (0) | 2020.12.31 |
| [자바 기초] 13일차 일지 1 - 화면(UI)구현(Ch.1 웹 프로그래밍의 개요) (0) | 2020.12.31 |
| [Spring 기반 자바(Java) 융합 개발자 2차] 2차 테스트 풀이 (0) | 2020.12.31 |