미디어 쿼리란 반응형 웹을 구현하는 CSS 기술이다.웹 페이지에 특정 조건을 설정해두고, 해당 경우에 작동하는 CSS 조건문인셈이다.간단한 예로 알아보자@media : 이 키워드는 media 쿼리를 시작하는 신호.only screen : 어떤 디바이스에서 적용할지 설정

position 속성 - relative, absolute, fixed inline, inline-block, block 에 대해서 float은 텍스트로 이미지를 감싸기 위해 사용 최근엔 flex를 위주로 더 많이 사용

위에 보이는 고양이를 사이트에 추가하려 한다.이미지를 넣는 방법에는 여러가지가 있다는데, 그 방법엔 어떤 것이 있고,방법에 따른 차이점은 무엇이며, 어떤 경우에 사용해야하나?먼저 이미지를 추가하는 방법에는 <img>태그와 {background-image}속성을 활

이전에는 Div에 id를 할당해서 html을 구성했다고 한다.근데 이는 수 많은 Id와 class값을 할당해야하기에,어떤 역할을 하는 컨테이너인지 알기 위해서는 시간이 들 수 밖에 없었다.그래서 각태그가 어떤 역할을 하는지 한눈에 구분하기 위해 나타난 것이 시멘트 태그

오늘은 html과 css 기본기를 잡기 위해, 클론코딩을 진행했다.혼자 공부하며 세운 목표 중 하나인 클론코딩 3번 도전을 위해서기도 하다.아무튼 오늘은 그동안 지켜만 보던 애플의 홈페이지를 따라만들어보기로 했다.감각적인 디자인이 많아서, 심플하게만 해도 어느정도 느낌

코딩에 들어가기 전 세부적으로 계획하는 습관을 들이자.작은것이라도 계획할 줄 알아야 나중에 큰 프로젝트를 진행할때도 차질없이 진행할 수 있다. 그리고, 자바스크립트로 동적인 웹사이트를 만들기 이전에는 정적인 것으로 구현해놓고 차근차근 바꿔 나가는 것이 구현에 있어 유리

자바스크립트를 활용해 실질적으로 웹이 동작하는 방식에 대해 익숙해져가고 있다.아직까지 완벽하게 이해하지 못하지만, 어려운 것이 아니라 낯선 것이라 생각한다.모르면 익숙해질때까지 반복하고 보면 될 것이다.늘 그래온 것처럼, 암튼 이번 시간에는 html에서 정보를 가져와

이번엔 벨로그 첫 커밋을 시도했다. 여기서 만든 것들은 모두 깃허브 페이지에 옮겨담을 예정이다. 일을 두번 하는 셈이지만, 이를 간소화할 방법을 검색해야겠다. 아무튼 본론으로 들어가서 오늘은, 자바스크립트의 배열문을 활용했다. loop > 반복문은 스크립트 태그를