keembloo

html 중앙정렬 하는 방법에는 여러가지가 있다. 그중 알맞은걸 활용하도록 하자. 1. text-align : center 정렬대상: 하위아이템 보통 텍스트 정렬할때 사용한다 2. margin : 0 auto 정렬대상: 본인 단, 사이즈가 지정되지않으면 상위사이즈인 100%로 인식되어서 적용되지 않는다 적용이 되지 않을 때 1. 가로 사이즈를 지정해줬는지 확인해본다. 2. 대상이 inline 속성일 때는 적용되지 않는다. inline 속성은 자기 자신의 컨텐츠만큼의 사이즈를 갖기 때문이다. 이럴경우 display : block; 속성을 주거나 block 요소의 태그를 사용한다. 3. display: flex; justify-content : center; 정렬대상: 하위아이템 이 방법은 내가 정렬시키고자..

SASS란? CSS의 확장 문법이다. SASS에서 입력한 코드는 CSS로 컴파일해야 실행시킬 수 있다. 기본적으로 들여쓰기를 사용한다. 1. Nesting (중첩) 상위 선택자의 반복을 줄일 수 있다. /*SCSS*/ .section { width: 100%; .list { padding: 20px; li { float: left; } } } 2. & (부모 선택자 참조) &를 사용하여 부모 선택자를 참조하여 사용할 수 있다. /* SCSS */ .fs { &-small { font-size: 12px; } &-medium { font-size: 14px; } &-large { font-size: 16px; } } 3. $ (변수) 변수를 선언할 수 있다. 선언한 블록 내에서만 사용할 수 있다. $col..

reset CSS란? 웹브라우저마다 default 값으로 스타일이 알아서 적용된다. ex) 입력하지 않아도 브라우저에서 자동으로 margin 값이 적용되는 경우 이는 브라우저마다 다르게 보여질 수 있기 때문에 CSS 스타일을 통일하여 보여줄 필요가 있다. default 값을 초기화 하기 위해 필요한 것이 reset css이다. reset CSS하는 방법 1. 구글에 [reset css] 를 검색하고 초기화 하는 코드를 찾는다. https://cssdeck.com/blog/scripts/eric-meyer-reset-css/ Eric Meyer’s “Reset CSS” 2.0 | CSS Reset One of the pioneers of the method, Eric Meyer's CSS Reset is ..

내용은 body 태그에 쓰면 되는데, 그렇다면 head 태그에는 무엇을 쓸까? head 태그 구성 요소 1. css 파일 link 2. style 3. title 4. meta 5. favicon :ico head 태그는 위5가지로 구성된다. meta란? meta는 웹브라우저의 정보를 알려준다. 어떠한 방식으로 렌더링이 되었는지, 누가 만들었는지, 어떠한 내용을 담고 있는지 등을 설명할 수 있다. 사용자의 눈에는 보이지 않는다. favicon이란? 웹페이지 상단 첫번째에 나오는 아이콘을 말한다. 브라우저마다 파비콘 별도 지정이 필요하다. https://www.favicon-generator.org/ 이 사이트에서 파비콘을 기기 or 브라우저 별로 한꺼번에 코드를 만들 수 있다. Favicon & App ..