전체 글190 CSS Battle #3 https://cssbattle.dev/play/3 CSSBattle CSS Code Golfing is Here! cssbattle.dev 세번째 문제. 일단 여기서 가장 중요했던 것은 모든 요소들이 다 가로와 세로에서 중앙정렬이라는 점. css에서 중앙정렬 하는 방법은 여러가지가 있다. 내가 모르는 방법도 분명 있을 것! 그 중에서 블럭 요소를 정렬하는데 많이 쓰이는 것으로 지금 딱 떠오르는 것은 2가지이다. 첫번째는 margin사용. 두번째는 position사용. 첫번째의 경우 원하는 요소의 스타일에 margin:0 auto 을 적용하면 된다. margin이란 요소와 요소 외부 사이의 간격을 의미한다. 크롬에서 f12를 누르거나 오른쪽 마우스 클릭하고 맨 마지막에 "검사"를 클릭하면 개발자도구가 나.. 2020. 3. 9. CSS Battle #2 CSS Battle #2 https://cssbattle.dev/play/2 CSSBattle CSS Code Golfing is Here! cssbattle.dev 이 문제도 솔직히 쉽다. 박스 4개를 만들고 정렬하기만 하면 된다. 나는 nth-child를 사용했는데 그냥 class값이나 id값을 사용해도 간단했을 것 같다. css position 속성 값은 relative, absolute, fixed, static이 있다. 주의해서 기억할 점은 자식 요소에 position:absolute;를 쓰려면 부모 요소에 position:relative;를 꼭 적어줘야한다. 그리고 만약 부모가 absolute여도 포지션 기준을 그 부모로 하고 싶을 때는 자식에 또 abolute를 적어주면 된다. 그리고 나같은.. 2020. 3. 8. CSS Battle #1 퍼블리싱 관련해서 CSS 공부할 사이트는 넘치고 넘쳤다. 근데 사실 퍼블리싱 프로젝트는 초안이 있는 상태에서 해야 하는 경우가 많을 거라고 생각한다. 그런데 솔직히 퍼블리싱 테스트 할때 초안 일일이 만들어 가면서 하기가 너무 힘들다. 사실 귀찮은 거지만..ㅎ 그래서 이거저거 게임으로 연습할 사이트가 어디 없을까 생각을 하던 중 CSS Battle이라는 웹페이지를 발견했다! https://cssbattle.dev/ CSSBattle CSS Code Golfing is Here! cssbattle.dev 만들어야하는 이미지가 정해져있고, 그걸 만들기 위해 CSS를 짜는 게임이다. 영어로 되어있는 페이지이지만 크게 어려울 것은 없다고 생각한다. 글자수로 계산해서 점수가 매겨지기 때문에 글자수를 적게써서 정답을.. 2020. 3. 7. 포트폴리오 추가. 티스토리 첫글. 짧게 일했던 회사를 저번주에 그만두고 코로나덕에 집에서 방콕하며 너무 놀면서 지내니깐 학원에서 배웠던 것들도 많이 까먹는 것 같다ㅜㅜ 그래서 어차피 코로나 때문에 공고도 많이 안 올라오니까 자체 프로젝트를 몇개 만들어보기로 결심은 했다. 결심으로만 끝날지는 과연? 일단 지금 내 포트폴리오에서는 학원에서 했던 것들로 이루어져 있다. 포트폴리오 시작 페이지는 요런느낌! 뉴욕삘이 물씬 나는 게 완전 내 취향 세부 메뉴에 들어가면 디자인만 한 프로젝트들과 코딩도 같이 한 프로젝트들로 나누어져 있다. 아트워크 3 배너 2 이벤트 페이지 2 웹메일 1 프로모션 페이지 1 모바일 디자인 1 리브랜딩 1 리디자인(반응형) 이렇게 이루어져 있다. 다행히 학원 선생님도 그러셨고 고용부 선생님도 포트폴리오가.. 2020. 3. 7. 이전 1 ··· 29 30 31 32 다음
