디지털 노마드를 꿈꾸며/CSS7 CSS | <nav> 상단에 고정시키는 방법 예전에 했던 클로닝을 다시한번 복습중인데 또 다른 어려움에 봉착했습니다. 분명 예전에 배웠던 건데 아직도 익숙하지 않아서 똑같은 지점에서 헤매는 상황이에요. 바로 네비게이션 메뉴를 고정시키는 것입니다. 원하는 모양은 웹페이지를 스크롤해서 화면을 내려도 계속해서 메뉴가 상단에 고정되도록 하는 거에요. 현재까지 완성시킨 모습은 다음과 같습니다. display: inline-block을 이용해서 각각의 메뉴들을 가로로 정렬시켰고, 각각 메뉴의 ul, li의 여백들을 없앤 상태로 개별 메뉴인 li에 오른쪽, 왼쪽 여백을 15px씩 줬습니다. 지금까지 모습에 해당하는 CSS는 이러합니다. 지금부터는 상단에 메뉴를 고정시키는 작업을 할거에요. 어떤 CSS를 활용해야할까요? 바로 position입니다. Positon.. 2020. 5. 30. CSS | <nav> 메뉴들을 가로로 정렬시키기 또 다른 문제가 발생했습니다. 계속해서 홈페이지 클로닝을 하고 있는데 아주 기초적인 듯 하지만 제 머릿속에서는 도저히 생각나지 않는 문제... 현재 홈페이지 상단의 메뉴 상태는 이러합니다. 를 적용해서 메뉴를 구성하는 것도 이제 좀 알겠고, 각각을 과 로 지정하는 것도 알겠습니다. 하지만 제가 결과적으로 만들어내야 하는 모양은 content, works, experience, behance, twitter, linkedin이 가로로 쭉- 나열되어야 해요. 여기서 뭘 어째야 하는건지....? CSS에 적용했었던 건 알겠는데, 예전에 연습할 때 했었던 기억이 날듯 말듯 하긴 한데 무엇을 어디에 어떻게 적용해야 하는 지 당최 기억이 나질 않습니다. 다시 돌아가서 구글 창에 열려있는 현재 진행중인 웹페이지를 분.. 2020. 5. 15. CSS 다양한 배경이미지 사용으로 감각적인 첫화면 만들기 맘에 드는 여러개의 이미지를 찾았는데, 그걸 배경화면에 다 넣어보고 싶다면? 가능할까요? backgroud-image를 이용하면 가능하더랍니다! 넣고싶은 이미지의 url을 연결해서 컴마로 쭉 써주기만 하면 끝! 그리고 각각 이미지의 크기와 위치를 조정해주기만 하면 되요. 연습용으로 처음 만들어본 저만의 웹페이지 입니다. 요즘 코로나니 뭐니 해서 건강해져 보려고 주스를 만들어 먹고 있는데, 일명 '부스터 주스'라는, 그걸 주제로 웹사이트를 만들어 보고 있습니다. 아무튼, 우여곡절 끝에 헤더를 만들어놓긴 했는데, 배경색인 salmon을 더 돋보이게, 그리고 웹사이트가 주스에 대해서 알리고자 한다는 것을 더 효과적으로 사용할 순 없을까요? 무료 사진 공유 사이트에서 눈여겨 봤던 주스에 관련된 이미지를 찾아봤습.. 2020. 4. 18. 이전 1 2 다음
