홍장군의 기록

0. 오늘의 배울 것. html 태그들은 박스모델을 따른다! 요소가 박스 안에 차곡차곡 쌓여있는 듯한 구조이기에, 박스모델 box model이라 불린다. 하나의 요소에 margin, border, padding, content 영역이 박스처럼 각자 자신의 영역을 차지하기 때문에 css를 잘 다루기 위해선 이 모델을 잘 알고, 각 속성을 어떻게 다루는지 파악해야 한다. 각 박스모델 태그들이 html이라는 하나의 파일 내부에서 어디에 놓일지 기본적으로 주어지는 위치 흐름이 바로 디스플레이다! html은 여러 요소들로 이루어졌다. 우리가 div 태그를 연달아서 쓰면 div 태그들은 박스가 차곡차곡 쌓이듯 위에서 아래로 배치된다. 반면에 span 태그를 여러 개 쓰면, span 태그들은 줄줄이 소세지처럼 연달아..

(css를 배울 때 가장 신기했던건 class나 id 이름으로 하이픈을 넣을 수 있단 것이었다...) 0. css의 기본 개념. html이 너무 길어지면 각 태그 하나하나에 style을 넣는 건 너무 번거로워진다. 때문에 각 태그들에게 어떤 style을 적용해줄지 규칙을 세워야 한다. 바로 이렇게 h1에 대한 규칙을 세우듯 태그들의 규칙을 세워 style을 적용하는 게 좋다. 즉, css를 개발한다는 것은 css 규칙을 만든다는 것이다. 1. css 규칙 html 의 내용과 그에 대한 css를 분리하는 것을 관심사의 분리, seperation of concern 이라고 한다. 관심사 분리의 장점: 내용과 스타일을 고치기 편하다. css 규칙은 선택자와 선언의 짝으로 이루어졌다. 선택자란 어떤 요소에 규칙..

0. html과 css란? html과 css는 웹사이트를 만들 때에 쓰는 프로그래밍 언어이다. 이 언어로 짠 코드를 소스코드 라고 하며, 코드를 작성하는 행위를 코딩 한다고 한다. html은 웹의 내용을 표시하는 프로그래밍 언어이다. css는 웹의 디자인을 꾸며주는 프로그래밍 언어로 cascading style sheet의 줄임말이다. html은 기본적으로 꺾쇠 기호를 사용해 시작태그와 종료태그로 내용을 감싸 표시한다. 각 태그에는 저마다 속성들이 있어 속성값을 부여해 커스텀할 수 있다. 1. 사이트에 이름 붙이기 이 이름 title은 웹 페이지에 나타나진 않되 페이지의 정보를 나타내주므로 head 태그 내부에 작성해준다. 2. 한글이 깨질 때 웹페이지의 문자들을 기계어로 바꾸어 컴퓨터가 이해하게 하는 ..