html&css 썸네일형 리스트형 html DOM(Document Object Model) 학습 내용 이번 시간에 학습할 내용은 프로그래머 관점에서 HTML을 바라보는 방법인 DOM(Document Object Model)이다. DOM은 브라우저 환경에서 자바스크립트를 이용해 HTML을 조작하는 모델이다. 예를 들어 HTML 문서에 이미 작성되어 있는 엘리먼트에 접근하거나 새로운 엘리먼트를 생성 또는 삭제할 수 있다. 즉, HTML요소를 Object처럼 조작하는 방법이다. 일단 HTML에서 자바스크립트를 적용하여 DOM을 사용하기 위해서는 이렇게 하면 해당 HTML에서 script.js의 파일의 코드를 사용할 수 있다. 이렇게 script태그를 넣으면 웹 브라우저는 작성된 코드를 해석하다가 script태그를 만나면 HTML 해석을 잠시 멈춘다. 그리고 script태그 요소를 먼저 실행한다. 이.. 더보기 CSS 중급1 학습 내용 이번 시간에 학습 한 내용은 css의 좀 더 실용적이고 깊은 내용을 학습했다. 그래서 이번 시간에 기술할 내용은 레이아웃의 전체적 구조를 조정하는 방법과 웹이나 앱을 본격적으로 개발하기 전에 시행할 와이어프레임(Wireframe)과 목업(Mock-up)에 대해서 서술하고자 한다. 레이아웃 리셋 레이아웃을 본격적으로 다루기 전에 HTML 문서가 가지고 있는 기본적인 스타일을 처리할 필요가 있다. 때때로 이것으로 인해 원하는 결과가 나오지 않기 때문이다. 이것을 레이아웃 리셋이라고 하고 라이브러리(Nomalize.css)를 사용하는 것으로 할 수 있다. 그러나 좀 더 간단히 간단한 코드로도 할 수 있다. * { box-sizing: border-box; } body { margin: 0; padd.. 더보기 CSS 기초2 학습 내용 셀렉터에 이어 속성들의 종류와 특징을 살펴보고자 한다. css에 미리 지정된 속성을 통해 다양한 디자인을 적용할 수 있다. 이번에 다룰 속성은 기본이 되는 몇 가지만 다룰 것이다. 혹시 더 많은 속성들을 찾고자 한다면, 개발자들의 교과서 MDN을 참고하기 바란다. 색상 글자의 색상을 변경하는 속성은 'color'이다. HEX라는 16진수로 RGB를 표현하여 결정하는 코드를 사용하거나 색상의 이름을 사용하여 색을 결정할 수 있다. css코드는 이렇게 사용한다. .red { color: #ff0000; //빨간색 } 글꼴 글꼴의 속성은 font-family를 사용한다. 속성의 값은 따움표를 붙여서 적용하고 만약 사용하려는 글꼴이 없거나 지원하지 않는 경우 fallback글꼴을 추가하여 대체할 수 .. 더보기 CSS 기초1 학습내용 프로그램을 만드는 것을 집을 짓는 것에 비유할 수 있다고 했다. 그중 html은 구조를 결정하고 기초공사를 하는 것이다. 이번에 배울 css는 그 구조와 외관의 디자인을 결정하는 작업이다. css도 html과 같은 마크업 언어가 표현되는 방법을 결정하는 언어이지만, 디자인의 영역의 표현을 결정한다고 볼 수 있다. html과 마찬가지로 css 역시 프로그래밍 언어는 아니다. css를 구체적으로 배우기 앞서 css에 대한 인식과 간단한 css의 구조에 대해서 살펴보고자 한다. css에 대한 오해 보통 사람들이 css를 볼 때 css는 개발자의 영역이 아닌 디자이너의 영역이라고 오해를 많이 한다. 그러나 css는 디자이너만의 영역이 아니다. 개발자가 만드는 일반 사용자를 대상으로 하는 앱은 UI(Us.. 더보기 html 기초1 학습내용 웹 개발은 집을 짓는 것과 같다. 집을 지을 때 짓기 전 먼저 어떻게 지을지를 구상하고 기초공사를 하고 건물을 올리고 마지막으로 외관을 꾸민다. 웹 개발 역시 이러한 과정이 있다. 어떻게 만들지 구상하고 기초작업을 하고 내용을 채우고 디자인을 한다. 여기에서 구상하고 기초공사를 하는 작업이 바로 html의 영역이라고 할 수 있다. html은 HyperText Markup Language의 약자이다. 기능적으로 본다면 웹 페이지의 틀을 만드는 마크업 언어라고 할 수 있다. 즉, 구조를 표현하는 언어이다. 그런데 html 역시 언어이다 보니 프로그래밍 언어와 쉽게 혼동할 수 있다. 그러나 html은 프로그래밍 언어는 아니다. 프로그래밍 언어와는 그 역할이 다르다고 볼 수 있다. html은 수많은 t.. 더보기 이전 1 2 다음