6주차

HTML5

https://www.w3.org
https://www.w3schools.com

웹표준 -

Client Side Script : html, javascript, vb,.... <---- 해석의 주체가 브라우저
Server Side Script : jsp/servlet , asp/aspx, php,..... <---- 해석의 주체가 웹서버

형식>

New Document

• 확장자 : .html / .htm

  HTML : 문서Html 구조(형식)
  tag : 한쌍으로 구성 <=> 단항태그 있음
  CSS : 디자인
  JavaScript : 동작,기능 (이벤트처리), 유효성 검사....

• 설정하기

Tag 연습 입니다.

Server Side Script :
Client Side Script <----- 서버 구축 안되어 있어도 실행됨. 브라우저가 해석하기 때문에 웹브라우저만 있으면 실행됨

• 편집기 : 메모장, 에디터플러스, 울트라에디트,...한글,....이클립스 등등에서 편집가능함

웹서버 구축 - 톰켓(tomcat), 웹로직, 웹스피어, 로젠,......
http://apache.org/
http://tomcat.apache.org/
1) 설치형
2) 폴더형

• 환경변수 설정
  TOMCAT_HOME
  C:\app\apache-tomcat-8.0.45
  path 편집 :
  ;%TOMCAT_HOME%\bin;

오라클 포트 번호 확인 & 변경
SQL> sqlplus /nolog
SQL> conn /as sysdba

SQL> select dbms_xdb.gethttpport() from dual;
8080

SQL> exec dbms_xdb.sethttpport(9090);

SQL> select dbms_xdb.gethttpport() from dual;

Tomcat 에서 톰켓 포트 번호 변경 방법 (8080)
1) 설정파일을 변경하기 : server.xml
2) 이클립스에서 변경하기 - 1, 2

톰켓에서 포트 번호 확인
C:\app\apache-tomcat-8.5.63\conf\server.xml

http://192.168.1.15:8080/day30_html/html/ex01_basic.html

HTML5 & CSS & Javascript

• 주석

  DOCTYPE

• 4.0.x

• 5.x

  html - 유연성 / xml - 엄격함

http://192.168.1.15:8080/day31_html/html/ex03_list.html

CSS
태그 속성="값"

css 적용한 경우
선택자 { 태그 속성 : 값 ; }

CSS & CSS3

1) inline

><img src="../images/1.jpg"  style="border: 3px solid skyblue; ">
<img src="../images/1.jpg"  style="속성: 값 ; 속성: 값;.... ">

2) internal

   <style type="text/css">
 	body { background-color: pink; }
 	
 	img { border: 5px dashed red; } 
 	
	.accent {
		font-size: 20px;
		color: red;
		font-weight: bold;
	}
	span#blue { color: blue; }
   </style>

3) external <--- file.css

 <link href="../css/style.css"  rel="stylesheet"  type="text/css"  >


 태그 속성="값"

 css 적용한 경우    
 선택자 {  속성 : 값 ; 속성: 값,...}
 선택자, 선택자2, 선택자3 {  속성 : 값 ; 속성: 값,...}
 선택자 서브엘리먼트 {  속성 : 값 ; 속성: 값,...}
  p  em  {  속성 : 값 ; 속성: 값,...}
  div span  {  속성 : 값 ; 속성: 값,...}
 
 .className  {  속성 : 값 ; 속성: 값,...}
 ex) .accent  {  속성 : 값 ; 속성: 값,...}
      .red { color : red; }

 선택자.className  {  속성 : 값 ; 속성: 값,...}
 ex) p.blue  {  속성 : 값 ; 속성: 값,...}

 #idName  {  속성 : 값 ; 속성: 값,...}
 ex) #header  {  속성 : 값 ; 속성: 값,...}
      div#id  {  속성 : 값 ; 속성: 값,...}


<a href="site"> site </a>
<a href="mailto:happydoyeon88@gmail.com"> 관리자 </a>

chrome 부가기능 추가
https://chrome.google.com/webstore

HTML5 & CSS & Javascript

문제] 학생 객체 - 이름, 학급, 학년
직원 객체 - 이름, 부서, 직급, 연락처
객체 만들어서 데이터값 넣고, 출력 하기 만들기

json

var obj = {
	필드 : 값,
	필드 : 값,
	필드 : 값,....
	메소드명 : function() {
		내용; 
	}
};

var obj = {

	[
		필드 : 값,
		필드 : 값,
		필드 : 값,.....
		메소드명 : function() {
				내용;
			}
	],
	[
		필드 : 값,
		필드 : 값,
		필드 : 값,.....
		메소드명 : function() {
				내용;
			}
	]
};

JSP
<% : jsp 시작 태그

%> : jsp 닫는 태그

전송방식 : get / post