기억하기 위한 기록

기본 레이아웃 작성 1. header _ html 2. css header는 고정될수 있도록 position : fixed ; 해준다 - 로고가 센터에 위치할 수 있도록 해주는것 header의 height 과 동일한 값으로 line-heigh의 값을 매겨주면 , 태그가 가 센터로 위치하게 된다. - 로고를 제외한 nav요소들이 오른쪽으로 올 수 있도록 float : right ; 해주면 오른쪾으로 오는것을 볼 수 있다. - 아래로 떨어진 메뉴들을 정렬해준다. ㄴ> li는 block속성으로 block속성을 유지하면서 + inline 속성이 여으로 나열 될 수 있도록 inline-block으로 지정해주겠다. block속성은 한줄을 다 차지하는데, inline 속성은 옆으로 나열이 되기 때문에 완성본의 결과와..

파비콘 없는 웹사이트는 거의 찾기 어렵다고 볼 수 있다. 웹사이트 제작 강의들을 들으며 , 파비콘 등록은 따로 알려주지 않아서 게시글을 작성해 본다. 파비콘 등록은 아주 간단하게 할 수 있다. 헤드태그 안에서 작성하면 되고, link 속성에 shortcut icon 을 입력해준뒤, href에 파비콘이 위치한 경로를 적어두면 된다. 간단하게 포토샵을 이용해 만들어보았다. * 어차피 웹사이트 타이틀 옆에 작게 들어가기때문에 한글자 정도가 깔끔한것 같다. * 굳이 확장자를 변환하지 않아도 png 로도 가능하기 떄문에 , png로 작업하였다. ▼ 등록방법 ▼ 파비콘 등록 전 ▼ 파비콘 등록 후

1. news section html코드를 작성한다. ㄴ> div로 두 영역을 잡아주고 issue 로 클래스명을 동일하게 묶어줌 2. news 영역의 width 값을 1400으로 주고, height는 자동으로 준다. 영역이 가운데로 올 수 있도록 margin 0 auto 를 준뒤 나란히 정렬될 수 있도록 보기 쉽게 green으로 영역을 표시해준뒤 작업한다. 3. issue 들을 전체 영역인 news에서 덜어트려 주기 위해 margin-top을 주고, width값을 준다. div마다 영역이 할당될 수있도록 49%로 일단준뒤 왼쪽으로 정렬하기 위해 float : left ;를 준다. ㄴ> issue에 작성해주고 난 처음에 먹여준 section.news에 bg 컬러가 사라진것을 볼 수 있다. 이유는 ? 자식요..

1. ul > li > 로 텍스트와 이미지를 넣어준다, ▼ 1번 결과 2. main section과 동일하게 width 값은 1400px로 변경해준다. 3. 가운데로 오게끔 margin 값을 조정해주고 margin { 0 auto; } , 함께 행복한 소비생활 h2가 가운데로 올 수 있도록 text-align:center; 해준뒤, 아래의 ul과 여백을 주기 위해 h2에 margin-bottom:50px;준다. ▼ margin-bottom :50px 한 결과값 4. ul은 section happy의 width인 1400px에 꽉 찰 수 있도록 100%를 준다. 5. 보기 편하도록 li를 float : left로 정렬해준다. 정렬하고 나니 우리가 4번에서 적용한 ul이 날라간것을 볼 수 있다. (yello..