html

hr 태그, Horizontal Rule 수평바, 구분자 문단과 문단을 구분하는 역할 콘텐츠와 콘텐츠를 구분하는 역할 단독태그 hr태그의 속성 size: 선의 두께(px) width: 선의 너비(px, %) align: 수평 정렬 color: 선의 색상 noshade: 그림자 유무 (→ 색상이 있으면 적용X, 값이 없어서 이름만 적음. 적으면 적용. 안적으면 미적용) title: 풍선 도움말(Tooltip, Hover Text)(→ 마우스 커서를 대고 있으면 아래 네모박스 도움말이 뜨는 것_평균 0.2초후 show up) See the Pen Untitled by 박나래 (@kdzhfgez-the-selector) on CodePen. HTML 속성 유형 숫자(단위없음) → 아래 둘 중의 하나의 경우 픽..

제목 태그, hn 태그, Heading 제목 태그 문서 내의 제목을 출력하는 태그 n: 1~6 → 제목의 중요도 , , , , , 쌍태그 혼합형 제목입니다. 내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다.내용입니다. 제목입니다. 제목입니다. 제목입니다. 제목입니다. 제목입니다. hn태그의 align 속성 수평 정렬 ⚠️ 주의사항 '상위 그룹부터 하위 그룹으로 내려가며 사용하면 된다' 라고 생각하기! ex) 작은 글씨로 포스팅하고 싶어서 없이 를 사용하면, 이 없이는 가 존재하지 않기 때문에 구글봇..

p 태그 문단 태그 텍스트 집합 쌍태그 혼합형 p태그의 align 속성 horizontal alignment → 수평 정렬 내용물의 수평 정렬 열거형 → left | center | right | justify left: 왼쪽 정렬 right: 오른쪽 정렬 center: 중앙 정렬 justify: 양쪽 정렬 left 정렬과 justify 정렬 비교 더럼 사장은 ~~~ 설명했다. 웨스팅하우스는 ~~~ 판결을 내렸다. ⚠️ 주의사항 태그 대신 사용 금지! WHY? 대신 을 사용하더라도 겉으로는 동일하게 보일지 모르나, '문단'에 사용하는 Tag가 존재하기 때문에 굳이 를 두고 을 쓸 이유가 없다. → 용도에 맞게 적합한 Tag를 사용하는게 맞다. 사용의 추가 문제점은 style 적용 시 해당 문단의 소유자가..

Create a Dynamic Web Project Eclipse의 Dynamic Project 1개는 웹 사이트 1개와 동일하다. 1. New → Dynamic Web Project 2. New Dynamic Web Project 생성(Project name: Hello) 3. webapp 폴더의 하위 항목으로 hello.html을 생성한다. 💡 모든 브라우저에게 주고싶은 자원은 webapp 폴더 또는 webapp의 자식폴더에게 넣어야한다. 때문에 저 폴더가 Content directory 내용물을 담을 수 있는 webapp 폴더에 create a HTML 해야함!! 프로젝트 이름이 Context root 인뎅 이걸로 URL 입력시 사용. 4. html파일의 내용을 아래와 같이 입력한다. Hello W..

head태그 문서의 머리말 역할 브라우저가 보는 정보 브라우저에게 전달할 내용을 작성 내부 정보 head 태그 내부에 넣을 수 있는 태그 종류(자식 태그) 1. 웹 페이지에 추가 정보 전달 페이지에 대한 여러가지 정보를 기술 2. 문서 제목(페이지 제목 지정) 제목 표시줄(탭) 문서의 제목으로 사용 검색 엔진의 수집 대상 + 검색 결과의 제목으로 사용 북마크 제목으로 사용 3. 웹 페이지에 스크립트 추가 4. 웹 페이지에 다른 파일 추가 5. 웹 페이지에 스타일시트 추가 6. 웹 페이지의 기본 경로 지정 검색 사이트 종류 1. 디렉토리 서비스 - http://yahoo.com 2. 키워드 검색 서비스 - http://altavista.com, 심마니, 엠파스 - http://google.com - 검색봇..

HTML 언어의 구성 요소 태그(Tag), 엘리먼트(Element) ⭐⭐⭐ 속성(Attribute) ⭐⭐⭐ 텍스트(PCDATA) ⭐⭐⭐ 엔티티(Entity) 주석(Comment) 선언문(Declaration) 외부요소 등등.. 1. 태그(Tag), 엘리먼트(Element) 예약어(명령어)를 로 묶어놓은 요소 출력될 웹페이지의 골격 형성 레이아웃 형성 요소를 배치 출력과 관계된 행동을 한다. 1-1. 태그 표현 방식 내용물 영역 쌍태그 : 시작 태그 : 끝 태그 영역을 가지는 태그 , , 단독 태그, 빈태그(Empty Tag) 영역을 가지지 않는 태그 1-2. 태그 내용물 형식, Content Type 내용물 자식 태그 또 다른 태그들이 내용물로 올 수 있다. 문자열은 올 수 없다. PCDATA, Pars..

공백 문자, Whitespace 엔터(Enter), 탭(Tab), space(스페이스) 페이지 소스에 있는 공백 문자들을 브라우저가 처리하는 규칙 (종류와 상관 없이) 소스상의 1개 이상 연속된 공백 문자들을 단 1개의 공백 문자(스페이스)로 치환해서 화면에 출력한다. 공백문자 처리하는 방법 스페이스 표현 non-breaking space 를 사용하면 모든 공백을 표시한다. 공백 1글자 → 엔티티 1개 &엔티티명; "출력할 때 공백 1개로 바꿔서 출력하렴!!" 탭문자 불가능(탭은 편집기에만 있는 기능) 웹 문서(브라우저)에는 탭의 개념이 없다. 개행문자 태그 사용 break(줄바꿈) \r\n 역할 하나 공백 5개 둘 셋 넷 다섯 여섯 HTML 삽입 미리보기할 수 없는 소스 특수 문자 표기 < < less..

HTML 문서 구조 - 태그는 트리구조(계층구조)로 되어있다.(★★★★★) - 메모리에 로딩된 트리구조 → DOM HTML 문서 확장자 - *.html - *.htm HTML 페이지의 구조 1. DOCUTYPE 문서 유형 DTD라는 언어로 선언된 선언문 이 문서를 읽는 웹 브라우저에게 ‘이 문서는 이런 유형의 문서다.’ 라고 알려주는 역할 ⇒ 때문에 반드시 첫 행에 나와야 한다. : 이 문서는 HTML5로 작성된 문서입니다. 2. 루트 태그 문서 전체를 감싸고 있는 역할 스스로 하는 일은 없다 → 문서 컨테이너 역할 모든 HTML 페이지의 기본 요소로, 모든 태그는 이 html 태그 내부에 작성한다. html 태그의 속성 lang: 웹 브라우저 동작에는 영향을 주지 않고, 구글 같은 검색 엔진이 웹 페이..

HTML, Hyper Text Markup Language 하이퍼 텍스트 마크업 언어 프로그래밍 언어(X) → 프레젠테이션 언어(O) : 무언가를 표현하는 기능을 가진 언어 Hyper Text: 링크 Markup: 언어 표기법 → HTML, XHTML, XML, VoiceXML, **ML SGML → 메타 언어 → 다른 언어를 정의할 수 있는 기능을 가진 언어 HTML, XML HTML 주관 단체 W3C, World Wide Web Consortium, WWW 모든 기술 생성 + 주관 https://w3.org WHATWG (WHATWG vs W3C → WHATWG 승리(주도권 획득). 그러나 둘이 합친 상태라고 보면 됨.) 팀 버너스리(WWW, HTML의 아버지) 한 획을 그은 HTML version들..

1. 톰캣 설치 1. http://tomcat.apache.org Apache Tomcat® - Welcome! The Apache Tomcat® software is an open source implementation of the Jakarta Servlet, Jakarta Server Pages, Jakarta Expression Language, Jakarta WebSocket, Jakarta Annotations and Jakarta Authentication specifications. These specifications are part of the tomcat.apache.org 2. 좌측 사이드바 → Download → Tomcat 9 선택 (https://tomcat.apache.org..