패키지
HTML,CSS 본문
<< 웹 어플리케이션 >>
웹클라이언트 웹서버 --------------------------------------- 브라우저(IE, FF, CR) Apache Tomcat(Java기반) 1.요청(웹주소-영문도메인, IP주소) 2.응답 및 결과 반환 HTML,CSS,Javascript,JSP,Servlet 3.반환된 결과 출력 HTML,CSS,Javascript -> 웹페이지 ---------------------------------------
* HTML
HTML(Hyper Text Markup Language)
1. 웹페이지 작성용 언어. Markup Language의 한 종류. 태그(<태그명>) 형태의 명령으로 구성된 언어. 마크업 언어는 특정 데이터를 표식하는 언어. 예를 들어,홍길동 -> 데이터 자체 <이름>홍길동</이름> -> 태그로 표시된 데이터 형식.2. HTML 기본 구성 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> 콘텐츠 작성 영역 </body> </html>3. 마크업 언어의 기본 규칙 - <태그명>데이터</태그명> : 시작 태그와 끝 태그의 쌍으로 구성. - 태그명은 식별자 작성 규칙에 맞춰서 작성. 일반적으로 소문자 사용. - 부모 태그와 자식 태그로 구성될 수 있다. 최상위 부모를 루트라고 한다. 예를 들어, <루트> <부모태그> <자식태그></자식태그> </부모태그> </루트> - 태그 안에는 부가적인 정보를 위해서 속성을 추가할 수 있다. 예를 들어, <태그명 속성="값" 속성="값" ...>데이터</태그명>
* CSS
CSS (Cascading Style Sheets)
1. HTML 태그만으로는 표현 부분이 부족하기 때문에 CSS를 이용해서 출력 형태를 지정하게 된다. 2. CSS 기본 형식 "CSS 속성명 : 값" 형태의 명령을 특정 대상에 적용하면 지정된 속성에 따라 출력 형태가 달라진다. 예를 들어, "color:red" 명령을 이용하면 특정 대상의 전경색이 빨간색으로 출력된다.
3. CSS 적용 방법
- 인라인 단위 적용 방법 : 특정 태그에만 적용되는 CSS. 웹페이지 내에서 특정 부분에만 적용하는 스타일 지정시 사용.
- 페이지 단위 적용 방법 : 특정 페이지에만 적용되는 CSS. 웹페이지 전체의 스타일 지정시 사용. - 파일 단위 적용 방법 : 특정 파일 단위로 적용되는 CSS. 웹사이트 전체의 스타일 지정시 사용. 4. 인라인 단위 적용 방법 <태그명 style="CSS속성:값; CSS속성:값; ...">데이터</태그명> 5. 페이지 단위 적용 방법 <style type="text/css"> 선택자 { CSS속성:값; CSS속성:값; ... } </style> -> 선택자는 여러가지 표현에 의해 특정 태그를 찾는 명령이다. 한 개 이상의 태그를 동시에 찾을 수 있다.
Comments