media

Visual Studio Code/Visual Studio Code icia 33일차

Visual Studio Code MediaQuery에 대해서

각 홈페이지마다 가로범위를 줄이면 다르게 표현되는 홈페이지들이 있다. 이런 홈페이지들이 MediaQuery를 썼다고 할 수 있는데 한 상자를 만들어서 색은 토마토색 , 200 x 200 으로 만들었다. @media (max-width: 900px) { .container { background-color: dodgerblue; width: 100px; height: 100px; } } @media (max-width: 700px) { .container { background-color: violet; width: 300px; height: 300px; } } 만약 브라우저 크기가 900px 아래라면 , 색을 블루로 바꾸고 크기를 100 x 100으로 바꾸어지게 된다. 또 , 700px 아래라면, 색을 ..

Visual Studio Code/Visual Studio Code icia 33일차

Visual Studio Code float로 layout 지정하기

1. Float로 Layout 지정하기 1 - 1 코드 - body 간단하게 이런 형식의 layout을 지정하고 싶을 때, Home 저는요 Portfolio Contact Me header 영역 nav 영역 section 영역 footer 영역 div 태그의 속성을 menu로 지정하고 리스트 태그를 이용해 메뉴를 만들었다. 각 항목마다 누르면 링크므로 반응하지만 href가 #이기 때문에 이동하지는 않는다. 다른 div 태그의 속성은 container로, 그 안에는 div 태그의 속성 header , main , footer가 있고 main 안에 div 태그의 속성 nav , section이 존재한다. 1 - 2 Style ul { list-style-type: none; overflow: hidden; ..

swkn
'media' 태그의 글 목록