CSS before와 after 어제 CSS를 사용해 툴팁을 만들면서, ul 태그에 after 속성을 준 후 만들었는데, before와 after가 무슨 역할인지 정확히 몰라서 찾아보게 되었다. 간단히 말하면, before은 해당 엘리먼트의 첫 번째 자식을 만들고, 속성을 주는 것이다. after은 마지막 자식을 만들고 속성을 준다. 적용 실습을 하면서 before와 after를 적용해보았다. 인용구 만들기 q 태그 앞 뒤로 before와 after를 사용해 인용 문구를 추가해봤다. HTML Hello Chamy said Hi!! CSS q::before { content: "«"; color: blue; } q::after { content: "»"; color: red; } q::before 를 보면..
배운것들
이번에 가운데에 선을 긋는 작업을 하던 중, CSS를 사용해 `position: absolute`와 `left: 50%`를 주어 가운데에 선을 그으려고 했다. 3개의 DIV 내부에 선을 긋기 위해 아래와 같이 작업을 했다. 결과는 처참했다. 부모 div의 가운데가 아니라 전체 화면의 가운데에 같은 줄이 3개가 겹쳐서 그려졌다. 각 div의 가운데에 그리려고 검색을 하던 중 absolute와 부모와의 관계에 대한 글을 보게 되었다. absolute의 위치 기준은 position이 relative, fixed, absolute인 가장 가까운 부모이다. 즉 위의 코드에서는 부모 div가 기준이 아니라, body가 기준이 된 것이다. 나는 아래와 같이 부모 div 태그에 position을 relative로 주고..
body의 스크롤을 막을 방법 넷퍼넬3의 '보고서 > 넷퍼넬 ' 페이지에서 상단 오버뷰 클릭했을 때 해당 차트로 이동하는 기능을 구현하던 중 외부 페이지가 아래로 스크롤되는 문제가 발생했다. 보고서 내부가 스크롤 되기 전 외부 먼저 스크롤되어 발생하는 문제로 파악하고, 외부 스크롤을 막아 페이지가 변하는 것을 막아야 한다. body의 height, overflow 설정하기 첫 번째 방법은 아래와 같이 css에서 body의 height를 100%, overflow를 hidden으로 설정하는 방법이다. body { height: 100%; overflow: hidden; } 설정하려고 봤더니 이미 이렇게 되어 있었다. overflow를 scroll로 해두고 보았더니, 하단에 scroll 될 공간이 조금 남아..
문제 발생파이어폭스에서 localhost:10080으로 접속하려 하니 거부당함 (크롬에서는 정상적으로 접속 가능) 해결 방안여러 삽질의 결과 해결방안을 찾아냄 일단 firefox 주소창에 'about:config' 입력하고 들어감 그럼 주의해서 진행하라는 안내문을 볼 수 있고, '위험을 감수하고 계속 진행' 버튼을 클릭 그럼 설정을 검색할 수 있는데 여기에 'network.security.ports.banned.override'를 검색한다. 당연히 설정된게 없을 것이다. 여기서 문자열을 선택하고 '+'버튼을 누르면 이렇게 포트번호를 입력할 수 있게 되고 자신이 접속하려는 포트 번호를 입력하면 된다. 나는 10080포트로 접속할꺼니 10080을 입력할 것이다. 입력을 한 후 체크 버..
필요성 리눅스 기반으로 프로젝트를 진행하므로 기본적인 리눅스 사용법을 익혀야 함 리눅스 명령어 pwd Print Working Directory 현재 작업중인 directory 위치 출력 $ pwd /root cd Change Directory 절대 경로 또는 상대 경로로 이동 // 절대 경로 이동 $ cd /root/temp $ pwd /root/temp //상위 directory로 이동 $ cd .. $ pwd /root // 상대경로 이동 $ cd temp $pwd /root/temp ls List 현재 directory 내의 목록 리스트 출력 // 현재 directory 내의 볼 수 있는 목록만 출력 $ ls temp github sys_temp // 현재 directory 내의 목록의 상세정보를..
Putty로 ssh 접속을 할 때마다 아이디와 비밀번호를 입력해야하는 번거로움이 있음 이 번거로움을 원격 접속을 할 환경(여기서는 Linux)에서 RSA키를 생성하고 이를 접속을 시도하는 PC(여기서는 Window)의 putty에 등록하여 사용 기존에 putty를 사용해 ssh로 붙은 사람들에게 도움이 될 정보이고, 처음 putty를 사용하는 사람들의 경우 일단 putty로 ssh 접속을 성공하고 다시 보는 것을 추천한다. Step 1. 준비물 준비물은 puttygen, putty, ssh로 붙으려는 리눅스, putty ssh 접속 성공 Step 2. RSA 키 생성 $ ssg-keygen -t rsa 위의 명령어를 리눅스에서 실행시켜 RSA 키를 생성한다. 중간에 passpgrase와 file의 경로를..
Git git의 필요성 동시에 같은 파일을 여러 사람이 변경할 때, 어떤 파일이 최신 버전인지, 어떤 부분이 변경되었는지를 쉽게 확인할 수 있도록 도와주는 버전 관리 시스템 git을 사용해 소스 코드가 변경된 이력을 확인하고, 특정 시점에 저장된 버전과 비교하거나, 해당 시점으로 돌아갈 수 있음 기본 명령어 git clone 원격 저장소에 있는 내용을 로컬에 저장 git clone 형태로 사용 branch git branch : 모든 branch와 현재 branch가 무엇인지 알 수 있음 git branch -r : 원격 저장소의 branch 목록을 알 수 있음 git branch : 이름을 가진 새로운 branch 생성 git checkout : checkout 뒤의 이름을 가진 branch로 이동 g..