HTML 과 CSS CSS란? CSS란 Cascading Style Sheets의 약자이다. CSS는 HTML 요소들이 각종 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어이다. HTML4부터는 이러한 모든 서식 설정을 HTML 문서로부터 따로 분리하는 것이 가능해 졌다. 오늘날 대부분의 웹브라우저들은 모두 CSS를 지원하고 있다. CSS 적용 방법 HTML 문서에 CSS 스타일을 적용하는 방법은 다음과 같다. 인라인 스타일(Inline style) 내부 스타일 시트(Internal style sheet) 외부 스타일 시트(External style sheet) 인라인 스타일 (Inline style) 인라인 스타일이란 HTML 요소 내부에 style 속성을 사용하여 CSS 스타일을 ..
form 요소(feat.input 요소) form 웹 페이지에서는 form 요소를 사용하여 사용자로부터 입력을 받을 수 있다.또한, 사용자가 입력한 데이터를 서버로 보낼 때에도 form 요소를 사용한다. form 요소는 다음과 같은 문법으로 사용한다. action 속성은 입력받은 데이터를 처리할 서버 상의 스크립트 파일의 주소를 명시한다.이렇게 전달받은 데이터를 처리하는 스크립트 파일을 폼 핸들러(form-handler)라고 한다.method 속성은 입력받은 데이터를 서버에 전달할 방식을 명시한다. 따라서 사용자가 form 요소를 통해 입력한 데이터는 action속성에 명시된 위치로 method 속성의 방식을 통해 전달된다. method 속성 method 속성을 통해 명시할 수 있는 form 요소의 전달..
레이아웃 목차 HTML 레이아웃(Layout) 📌 레이아웃(layout) 이란 특정 공간에 여러 구성 요소를 보기 좋게 효과적으로 배치하는 작업을 의미한다. 웹 페이지의 레이아웃은 웹 사이트의 외관을 결정짓는 매우 중요한 요소이다. HTML에서는 다음과 같은 방법으로 레이아웃을 작성할 수 있다. div 요소를 이용한 레이아웃 HTML5 레이아웃 table 요소를 이용한 레이아웃 div 요소를 이용한 레이아웃 📌 div 요소는 CSS 스타일을 손쉽게 적용할 수 있으므로, 레이아웃을 작성하는데 자주 사용된다. 🔔 예제) div 요소를 이용한 레이아웃 HEADER 영역 NAV 영역 SECTION 영역 FOOTER 영역 실행결과 : HTML5 레이아웃 📌 HTML5에서는 웹 페이지의 레이아웃만을 위한 별도의 새..
블록과 인라인 HTML 요소의 타입 HTML의 모든 요소는 해당 요소가 웹 브라우저에 어떻게 보이는가를 결정짓는 display 속성을 가진다.대부분의 HTML 요소는 이러한 display 속성값으로 다음 두 가지 값 중 하나를 가지게 된다. 블록(block)인라인(inline) 블록(block) 타입의 요소 display 속성값이 블록(block)인 요소는 언제나 새로운 라인(line)에서 시작하며, 해당 라인의 모든 너비를 차지한다. , , , , 요소는 display 속성값이 블록(block)인 대표적인 요소이다. 요소 요소는 다른 HTML요소들을 하나로 묶는 데 자주 사용되는 대표적인 블록(block)요소이다.요소는 주로 여러 요소들의 스타일을 한 번에 적용하기 위해 사용된다. 인라인(inline)..
HTML 색 HTML 색(Color) 표현 HTML에서 색을 표현하는 방법은 다음과 같이 세 가지 방법이 있다. 색상 이름으로 표현RGB 색상값으로 표현16진수 색상값으로 표현 색상 이름으로 표현 W3C에서 정의한 16개의 HTML4 표준 색상 이름은 다음과 같다. aqua black bluefuchsiagraygreenlimemaroonnavyolivepupleredsilvertealwhiteyellow TIP : HTML에서 색상 이름은 대소문자를 구분하지 않는다. 현재는 주요 브라우저가 140개의 색상 이름을 모두 지원하고 있다. RGB 색상값으로 표현 모니터나 스크린은 빨간색(Red), 녹색(Green), 파란색(Blue)을 혼합하여 색을 표현한다. HTML에서도 위와 같이 세 가지 색을 가지고 ..
문자셋 문자셋(Character set) 웹 브라우저가 HTML 문서를 정확하게 나타내기 위해서는 해당 문서가 어떠한 문자셋으로 저장되었는지를 알아야 한다. 따라서 HTML 문서가 저장될 때 사용된 문자셋에 대한 정보를 태그 내의 태그에 명시한다. HTML4에서 UTF-8의 경우 HTML5에서 UTF-8의 경우 문자셋의 종류 현재 사용되는 대표적인 문자셋(character set)은 다음과 같다. ASCII : 가장 처음 만들어진 문자셋으로, 인터넷에서 사용할 수 있는 127개의 영문자와 숫자로 이루어져 있다.ANSI : 윈도우즈에서 만든 문자셋으로, 총 256개의 문자 코드를 지원한다.ISO-8859-1 : 256개의 문자 코드를 지원하는 HTML4의 기본 문자셋이다.UTF-8 : 세상에 있는 거의 모..
HTML 기초 HTML 이란 ? HTML은 HyperText Markup Language의 약자이다.웹 페이지는 HTML 문서라고도 불리며 HTML 태그들로 구성된다.각각의 HTML 태그는 웹 페이지의 디자인이나 기능을 결정하는데 사용된다. HTML 버전 버전 년도 DOCTYPE 및 설명 HTML 1.0 1991 팀 버나스리(Tim Berners-Lee)가 발표한 최초의 HTML HTML 2.0 1995 국제 표준의 제정된 최초의 HTML HTML 3.2 1997 W3C에 의해 제정된 최초의 HTML HTML 4.01 1999 XHTML 1.0 2000 HTML 5 2014 W3C W3C는 World Wide Web Consortium의 약자이다.W3C는 월드 와이드 웹(WWW)을 위한 표준을 제정하고 ..
목차 엔티티(Entity) HTML에는 미리 예약된 몇몇 문자가 있으며, 이러한 문자를 HTML 예약어(reserved characters)라고 한다. 이러한 HTML 예약어를 HTML 코드에서 사용하면, 웹 브라우저는 그것을 다른 의미로 해석한다. 따라서 HTML 예약어를 기존에 사용하던 의미 그대로 사용하기 위해 별도로 만든 문자셋을 엔티티(entity)라고 한다. 엔티티의 형태는 아래와 같다. &엔티티이름; 또는 &#엔티티숫자; 대표적인 엔티티(entity) 엔티티 문자 엔티티 이름 16진수 엔티티 숫자 설명 공백   줄 바꿈 없는 공백 (Non-breaking Space) > > 보다 큰 & & & AND 기호 " " " 큰 따옴표 ' ' ' 작은 따옴표 엔티티 코드 참고 ..