개편: 메인페이지 코딩완료

감성적 정리 :

아침에 겨우 와서 마라톤처럼 공부함.

해내고자 하는 것 송곳처럼 파고들지 못하는 습성..으로 인해

이것저것 실험하다 결국 목표량 끝마치지 못함.

동영상에 다 나와있다. 잘 보고 정리하는게 중요하다는 것 깨닫

한 것:

메인페이지 디자인까지 겨우 완성.

         

서브라임으로 마우스오버했을때 스탑효과 하고 태그 안닫아서 아침부터 화면 깨져나와 1교시 날림

가상요소로 헤더 햄버거 메뉴 만듦

before로 span을 세개써서 nth-child(2)와 3 등 만들어줌. width height만 있음 영역이 잡히는구나

플레이, 글씨, pagination 조절함 디자인적 height 맞춤

오후 2시부턴 하단 조정하다 시간다감.

내 방식대로 html에 img로 넣고 할 수 있을거라 생각해서 열심히 해봄

포토샵으로 이미지 사이즈 다 같이 맞춰주고, 이미지 자체에 width 값주고,(근데 width,height가 조금씩 달라 모양이좀 이상하긴함, 이럴땐 bg로 넣어서 bgsize 조정하는게 나았으려나) 서로 마진값으로 사이 늘려주고, 했음.

샘은 20%로 깔끔히 하라는데 잘 모르겠음. 이것도 겨우 했음. 모바일 화면 사이즈 그대로 pc도 크기 같아도 상관없다해서.. img 퍼센트로 나타내지 않음.

---

카페, 7시

상세페이지 조금 작업하는데 img랑 글 있을때 수직정렬하다 시간날림.

샘이 테이블에서만 수직정렬하는 거라심.

이럴땐 이미지 poa 쓰면 코딩이 쉬워짐.

오후10시~11시 모던 웹 폼태그랑 시멘틱 태그 등 정리좀 하려했더니 표 수정하기가 왤케 힘드냐

어차피 대충 아니까 동영상 보고 샘 사이트 참고해야겠다.

열동

---

집와서 html5 (responsive) 동영상1 봄

---

공부 정리 : (

아웃라이너는 체계적이다.

책의 차례역할와 같다. 구조 파악 하기 매우 좋다 !

반응형 사이트는
웹표준 만들때와 다르다. (웹표준은 width, height 값잡고 영역잡고 했음)

쉽게 짜기위해 먼저시멘틱 태그로 레이아웃을 짠다.

먼저 header pc화면 짜고 타블렛, 모바일화면 짜면된다.->이후 nav, main,... 마찬가지로

그러나, 시멘틱태그는 ex8에서 안먹기때문에 html5shiv

섹션이 의미가 있기위해선 제목을 제공해야 합니다.

예시 보기
한눈에 구조파악

---

가상요소

content: ''; w h 넣고 poa left right 넣어주기