본문 바로가기

코딩 공부

CSS header session footer등의 구조 1. Webpage를 구성 할 때 화면을 이런식으로 나눌 수 있다. header article footer 더보기
CSS 예제 (clear, overflow, box-sizing) 1. clear.both; 양쪽 정렬 제거. float속성을 사용하면 요소를 정렬시켜주는데 그걸 하고 싶지 않은 경우 사용한다. .div1{ float: left; width: 100px; height:40px; margin:0px; border: 3px solid green; } .div2{ border: 1px solid red; height: 50px; } .div3{ clear: both;} float 속성 사용 div1 div2 float 속성을 사용하여 대상 요소를 웹 문서에 배치한다 다시한번 div1 clear를 통해서 초기화한다. 2. overflow 이미지가 박스영역을 벗어남 이미지가 오른쪽 정렬로 되어 있는데 박스영역을 벗어났다. 이미지가 박스영역을 벗어날 경우에는 overflow속성을.. 더보기
CSS 예제 (ul, li, border, margin, position) 1 - 1. 세로 리스트 Home Profile Board Contact 1-2 가로 리스트 (float 속성) Contact Board Profile Home 2. Border 속성 CSS3 박스 모델은 content,padding,border,margin으로 구성되어 있다. 박스모델의 padding, border, margin 속성의 기본값은 0이며, 상하좌우 네가지 방향을 top bottom left right 를 이용하여 지정할 수 있다. 3. Margin 박스모델의 네 방향 여백지정 mp1 mp2 mp3 기본 값 (4개일 경우): top, right, bottom, left 기본 값 (3개일 경우): top, right &amp bottom, left 기본 값 (2개일 경우): top &amp .. 더보기
CSS CSS *{ color : red; background-color : yellow; font-size:14px; font-weight:normal; } *는 모든곳에 적용(universal selecter) 태그별로 스타일 적용 h1{ background-color:yellow;} h2{ background-color:green;} p{ background-color:skyblue;} tag selector 서로다른 색상 태그별로 다른 스타일 적용 시 사용 tag를 지정해서 적용하기에 동일한 tag에 모두 적용 아이디별로 스타일 적용 #id{ background-color:yellow;} #id1{ background-color:green;} #id2{ background-color:skyblue;} t.. 더보기
HTML TAG 이제까지 자바를 배웠다면 웹 페이지를 만들기 위해서 HTML 기초와 CSS를 알아야 웹페이지의 전체적 흐름을 파악할 수 있기에 많이 쓰이는 html태그를 알아보려 한다. 태그 종류 태그는 여는 태그와 닫는 태그가 있는데 닫는 태그에는 '/'를 붙여준다. - 제목 헤드라인 태그 (제목 태그)는 h1가 제일 큰 사이즈의 제목 태그이고 h6까지 숫자가 커질수록 폰트는 작아진다. - 기울임 태그 - 굵은 글꼴 - 밑줄 글꼴 - 취소선 *u와 s는 스타일 태그를 써서 넣는 것을 권장 다음 버전에는 아예 사라질 가능성도 있다. 왜냐하면 style태그로 사용할 수 있기 때문이다. - 문단을 나누는 태그 - 작성자의 원문을 그대로 가져올 수 있다. HTML 실행후 mail cafe blog shopping mail c.. 더보기
JSP 내장객체 JSP 내장 객체 개발자가 JSP파일 내에 객체를 생성하지 않고 바로 사용할 수 있는 객체가 내장 객체이다. JSP에서 제공되는 내장 객체는 JSP컨테이너에 의해 서블릿으로 변환될 때 자동으로 객체가 생성된다. 요청이 될 때 자동생성 HTTP Request방식 2가지 GET방식 서버에 데이터를 요청하는 용도 전송하는 데이터가 주소에 묻어서 간다. 전송했던 데이터는 브라우저의 히스토리에 접속했던 주소와 함께 남아있어 보안에 취약하다. 게시판 글 조회나 검색같이 서버의 정보를 가져올 필요성이 있을 때 사용 전송할 수 있는 최대 크기는 브라우저별로 다르지만 크기가 정해져 있다 (IE = 2048byte) HTML form태그가 반드시 필요하지는 않다.(주소창에 값을 묻혀 전달이 가능하기때문). POST방식 서.. 더보기
JSP의 사용 JSP 사용 jsp> html> JAVA 코드 JSP파일을 통채로 JAVA코드화 시킨다. 그것을 다시 HTML 태그로 랜더링 한다. 특징 1.동적 웹 애플리케이션 컴포넌트(자바 코드 사용 가능) 2.jsp 확장자 3. 클라이언트의 요청에 동적으로 작동하고 응답은 html이용 4.JSP는 웹서버와 통신 시에 자동으로 Servlet으로 변환됨 5.MVC패턴에서 View로 이용됨 JSP 태그의 개념 이해 -Servlet은 java언어를 이용하여 문서를 작성하고 출력 객체(Print Writer)를 이용하여 html 코드를 삽입합니다. -jsp는 서블릿과 반대로 html 코드에 java언어를 삽입하여 동적 문서를 만들 수 있습니다 -html 코드 안에 java코드를 삽입하기 위해서는 jsp태그를 이용해야 하며,.. 더보기
JSP 환경설정 본격적인 웹페이지 개발 공부 시작 이제 앞서 공부 한 JAVA와 ORACLE을 토대로 웹페이지를 만들기 위해 eclipse 설정을 해 보도록 하겠습니다. 우선 웹페이지에 올리기 위해서는 서버를 받아야 합니다. 환경설정 eclipse의 환경을 javaEE로 우선 바꾸고 시작합니다. window - perspective - open Perspective - other 에서 Java EE 를 선택하여 Open을 해 줍니다. 저는 벌써 디폴트로 되어 있네요. 그리고 아파치 톰캣을 다운로드 받아줍니다. 아파치 톰캣-9 Ver.zip (pgp, sha512) 파일을 다운로드해 주었습니다. 그리고 다운로드한 파일의 저장 경로를 기억해 둡니다. 이클립스 화면에서, 좌측 화면 하단에 서버 탭을 클릭, No servers.. 더보기