함께 알아가는 IT 정보

주말부터 화요일까지 공연 일정과 수업 일정이 있어서 수업에 참가하지 못했다. 38 39일차 수업은 주말에 업로드 하겠다!그래서 처음에는 반응형 모바일메뉴, 탑바, 모바일 탑바를 만드는 것 부터 시작했다. 솔직히 말해서 엄청 버벅이면서 만들었다. See the Pen 반응형 모바일메뉴 탑바, 모바일 탑바 by qBlackBirdp (@qBlackBirdp) on CodePen.이런 느낌인데 링크 타고 들어가서 보면 화면 크기에 따라서 탑바를 쓸지 모바일 탑바를 쓸지 결정해준다. 디테일을 놓치는 경우가 많았고 css를 html에 쓰는게 익숙하지가 않다. html의 뼈대를 잡는 것 또한 쉽지 않았다. 그래도 어찌저찌 만들고 나서 보면 조금 보이긴한다. See the Pen Untitled by j..

//정수가 담긴 배열 array와 정수 n이 매개변수로 주어질 때, array에 n이 몇 개 있는 지를 return 하도록 solution 함수를 완성해보세요.class Solution { public int solution(int[] array, int n) { int count = 0; for (int j : array) { if (j == n) { count++; } } return count; }}금방 풀었당다음 문제도 비슷하다.if문만 약간 바꾸면 된다.//머쓱이는 학교에서 키 순으로 줄을 설 때 몇 번째로 서야 하는지 궁금해졌습니다. 머쓱이네 반 친구들의 키가 담긴 정..

팝업 닫기 부터 시작한다. 어제 했던 방식은 가만 생각해보니까 일반적인 상황은 아닌 것 같다. See the Pen 팝업 닫기 by qBlackBirdp (@qBlackBirdp) on CodePen.x 버튼을 클릭하면 팝업 창은 사라진다. See the Pen 팝업닫기 (mouseenter mouseleave) by qBlackBirdp (@qBlackBirdp) on CodePen.팝업에 마우스를 올리면 (mouseenter) 팝업이 나타나고 x 버튼에 마우스를 올렸다가 치우면 (mouseleave) 팝업이 사라진다.기존 코드에서 제이쿼리만 살짝 바꿨다.다음은 되게 신기했는데 일단 보면 클릭하면 배경색이 바뀐다. See the Pen js로 body에 클래스 부여해서 배경색 바꾸기..

flex로 시작한다.Flex 참고 사이트1분 코딩 Flex컨테이너에 영향을 주는 코드flex-direction (정렬하는 방향을 정함)row:(기본값) row-reverse: column: column-reverse:flex-wrap (압축 풀기, 압축하기)nowrap:(기본값) wrap: wrap-reverse:align-items (세로를 기준으로 위치 정하기)flex-start: flex-end: center: baseline: stretch:(기본값)justify-content (가로를 기준으로 위치 정하기)flex-start:(기본값) flex-end: space-between: center: space-around:align-content (컨테이너 안에 있는 아이템들에 영향)flex-star..

어제 구현중이던 1차메뉴-2차메뉴는 이렇게 만들었다. See the Pen 1차 2차 메뉴 만들기 by qBlackBirdp (@qBlackBirdp) on CodePen.이건 어제 야매로 만든거고강사님이 하시는 걸 보면서 같이 만든 것이 아래거다. See the Pen 2차 메뉴 만들기. by qBlackBirdp (@qBlackBirdp) on CodePen.css를 짤 때 필요에 의해서 자손을 선택해주는거지, 처음부터 자손선택자를 사용하면서 절대, "절대로" 그렇게 하면 안된다고 하셨다. 어제 만들 때 어려웠던 이유가 아마 나도 저렇게 접근해서 그랬던 것 같다.아무튼 다음은 3차 메뉴까지 구현하는 것이다. See the Pen 3차메뉴 by qBlackBirdp (@qBlackB..

사실 어제 티스토리에는 코드펜이 제대로 올라왔는데 벨로그는 그렇지 않았다는 것을 알고 있다. (사실 너무 귀찮아서 하나하나 수정하기 버겁다고 생각해서 딱히 수정은 하지 않았다. 뭐 링크 클릭하면 들어갈 수 있으니까..) 보니까 벨로그에는 html로 복붙하는게 아니고 Iframe으로 복붙해와야된다고 한다. 오케이 참고 하고서 벨로그엔 iframe으로 티스토리에는 html로 해야지. 암튼 어제 bnx 사이트 모작하던거..는 전혀 발전이 없다. 딱 어제 내가 구현한 거기까지에서 멈춰있다. 아무튼 찝찝하게 다음으로 넘어간다.이미지 주변에 애매한 여백 없애는 라이브러리 See the Pen 이미지 주변에 애매한 여백 없애기.(라이브러리) by qBlackBirdp (@qBlackBirdp) on CodeP..

vertical align 문제를 다시 보면 section { width:200px; height:200px; border:10px solid red; font-size: 0; text-align: center;}section > div { width:50%; height:50%; background-color:black; display: inline-block; }section > div:nth-child(2) { background-color:green;}section > div:nth-child(3) { background-color:pink;}section > div:nth-child(4) { background-color:gold;}이렇게 풀었는데 여기서 폰트..

section 안에 사각형 div를 우겨넣는 문제인데, vertical align을 사용해서 풀어야했다. section { width:200px; height:200px; border:10px solid red; font-size: 0; text-align: center;}section > div { width:50%; height:50%; background-color:black; display: inline-block; vertical-align: middle; }section > div:nth-child(2) { background-color:green;}section > div:nth-child(3) { background-color:pink;}section ..

난 국비지원 수업을 Korea IT라는 학원에서 수강중이다. 학원에서 무료로, 취업이 목표인 수강생들에게 취업과 관련된 전략?이라고 해야될까. 아무튼 특강을 해서 들어보았다.다음으로는 그냥 글로 정리 해둔 글이라 두서가 없을 수도 있다. 양해 바란다.IT 업계는 기술의 변화가 빠르다.직무별 채용시장요즘IT, 글로벌 IT 뉴스 기사 읽기정보 보안쪽의 시장이 수요가 많은데 인력이 부족함.리눅스 2급, 네트워크 관리사 2급, 정보처리기사, 정보보안기사, CCNA 등의 자격증.나의 이력서가 뽑히지 않는 이유는?하나의 이력서로 돌려막기이력서를 쓸 때는 각 회사에 맞춰서 쓰는게 맞다.직무의 불분명.본인이 뭘 할 수 있는지 제대로 기재해라.감정적 호소, 부정적인, 자신없는 글감성적으로 글을 쓰지 마라. (EX. 비록..

어제 만들었던 것을 이어서 보자 css를 약간 고쳤다.body { background-color: black; text-align: center;}nav { letter-spacing:10px;}nav > div:first-child { background-color: white;}div.b { width: 50px; height: 50px; background-color: grey; display: inline-block;}div.a { margin-top: 300px; width: 50px; height: 50px; background-color: grey; display: inline-block; border-radius: 50%;}div.b.c:hover,div.a.c..