송조의 웹개발 공부

진짜 졸리 자고 싶은데....... 울집 고양이가 야리고 있어서 어절 수 없이 집중해서 정리를 해보겠읍니다.. ^.^ 했다가 쿨쿨자고 아침에 정리하는 클라쓰! 이거 알아두면 브라우저 크기 계산 안 해도 됨~~!!~!~ *Box Width (box sizing : content-box - 기본값) - widht:800px; padding:100px; border:100px real box width : 800(w) + 200(pL:100, pR:100) + 200(bL:100, bR:100) = 1200px 전체 화면에서 그냥 1200px를 차지하는 것 * Box Width : 100% - width:100% + padding:100px + border:100px = 100%+400px 이미 100%이기 ..

이거 진짜 ㄹㅇ 어렵당 ^.^ 난 심지어 이 수업을 똑같은 선생님한테 두 번째 듣는 것인데 ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 혁주쌤 제송.. ㅎ 욜시미 할게유.. * 여백 속성 1. margin 2. padding * margin 1. 바깥쪽 여백(위치 조정) 2. margin-top / margin-right / margin-bottom / margin-left 3. margin : top right bottom left margin : top right bottom (same right) margin : top/bottom right/left margin: all 4. margin : auto 상하 여백 0, 좌우 여백 동일 (블럭 요소 가운데 정렬할 때 사용) = margin : 0 auto 5. html4 이후로..

DOM (html의 구조) Document Object Model(관계 개념) * 트리형 차트 트리의 구성원을 node라고 부름. 돔트리 대충 이렇게 생긴 페이지가 있다고 치겠삼. 그러면 그림으로 표현했을 때 이렇다고 볼 수 있는데 (선생님이 대충 이렇게 그렸던 거 같음) * 태그들 간의 관계 용어 상위요소 하위요소 (부모요소) parent (자식요소) children (조상요소) ancestor (후손요소) decendent (형제관계) siblings - div a {} 조상과 후손일 경우에도 효과 적용 가능 - div > a {} 자식요소일 때만 선택 가능하기 때문에 선택되지 않는다. * 요소 레벨(Element Level) 태그가 어떻게 보여지는가(=줄이 바뀌나 안 바뀌나)에 대한 구분 - em ..

* 코딩 순서 1. 내용 작성 2. 마크업 3. 콘텐츠 블럭 4. CSS 초기화 5. CSS 작성 6. 스크립트 적용 7. 프로그래밍 적용 8. 표준/접근성 검사 9. 수정/보완 1. 내용 작성 내용을 잘 묶어주는 것이기 때문에 듣는 사람에게도 중요함. ★★전체 코딩 단계에서 가장 중요(접근성) 하지만 다음 페이지에 있는 내용을 그대로 긁어와서 미리보기를 하면 보기가 어렵기 때문에 태그를 이용해서 똑같이 만들어주는 작업을 하면 된다. 2. 마크업(실무에선 코딩이라고 함) : 용도나 목적에 맞는 태그 작성 - markup : 해석하다, 의미를 부여하다. 이런 식으로 마크업을 하면 미리보기를 했을 때 다음 메인페이지의 CSS를 제거한 것과 거의 똑같이 만들 수 있다. (맨 오른쪽이 찐다음) 3. 콘텐츠 블럭..