안오늘의 devlog

🍓𝗪𝗲𝗯

• [CSS] display, visibility

  🍓𝗪𝗲𝗯/𝖢𝖲𝖲 2021. 7. 5. 21:37

  inline 요소 : , , , 와 같이 줄 속에 끼워 넣는 요소 block 요소 : , , , , 과 같이 해당 요소가 속한 줄은 가로 화면 전체 100%를 차지하며 앞뒤로 줄 바꿈이 된다. display는 요소를 어떻게 표시할지 선택하는 속성이다. 1. display: inline - 기본값, 앞뒤로 줄바꿈 되지 않는다. 2. display: block - 요소를 block요소처럼 표시한다. - 요소 앞뒤로 줄바꿈 된다. 3. display: none - 박스가 생성되지 않는다. - 공간을 차지하지 않는다. - 스크린리더기에 읽히지 않아, 웹 접근성에 좋지 않다. 4. display: inline-block - 요소는 inline인데, 내부는 block처럼 표시함 - 박스모양이 inline처럼 옆으로..

  Read More
• GNB, LNB

  🍓𝗪𝗲𝗯/𝖢𝖲𝖲 2021. 7. 5. 21:21

  GNB (Global Navication bar) = 메인메뉴. 어느 페이지에 들어가든 공통적으로 사용할 수 있는 메뉴 최상위 메뉴로 보통 상단에 위치한다. LNB (Local Navigation Bar) = GNB를 누를 경우 소제목 형식으로 나오는 메뉴 네비게이션을 통해 특정 지역으로 가는 네비게이션 바

  Read More
• JavaScript로 별찍기

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 5. 08:57

  const n = prompt('크리스마스 트리를 몇 줄 원하시나요?'); let tree = ''; for (let i = 0; i i; j--) { star += ' '; } for (let k = 0; k

  Read More
• JavaScript False인 것들

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 5. 07:26

  자바스크립트는 null, undefined, 0, 빈 문자열, NaN, false를 제외하고는 다 참인 값으로 판단한다.

  Read More
• JavaScript 데이터 타입 확인 : typeof

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 5. 07:24

  typeof: 타입 확인 배열의 데이터 타입을 확인하면 object를 출력하므로, javascript에서 배열인지 확인하려면 isArray()함수를 사용한다.

  Read More
• Javascript 배열 내장함수

  🍓𝗪𝗲𝗯/𝖩𝖺𝗏𝖺𝖲𝖼𝗋𝗂𝗉𝗍 2021. 7. 5. 07:10

  1. pop: 배열 뒤에 값 제거 2. splice: 배열 중간에 값 추가/삭제 splice(start, deleteCount, items원소) : 시작 인덱스, 지울 갯수, 추가할 items splice() 메서드는 배열의 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경한다.

  Read More
• [HTML/CSS] 반응형 웹의 미디어쿼리

  🍓𝗪𝗲𝗯 2021. 5. 25. 10:07

  반응형 웹 반응형 웹(Responsible Web)이란 디바이스(전자기기)별로 각각 레이아웃(grid)이 달라지는 웹 화면의 크기 마다 레이아웃이 달라진다. 반응형 웹에서는 필수인 미디어쿼리는, 화면크기마다 각각 다르게 CSS를 적용하는 것이다. 화면 사이즈를 인식해 서로 다른 CSS를 적용시켜준다. 보통은 스마트폰, 태블릿 , PC 화면 3개 정도를 구분해준다. 해상도 320px 이상 또는 768px 미만 -> 스마트폰 해상도 768px 이상 또는 1024px 미만 -> 태블릿 해상도 1024px 초과 -> PC /* 모바일 디바이스 */ @media screen and (min-width: 320px) and (max-width: 480px) { body { background: pink; } } /..

  Read More
• 자바스크립트 기초 정리

  🍓𝗪𝗲𝗯 2020. 10. 6. 17:36

  1. 자바스크립트 역사와 현재, 미래 사용자가 다이나믹한 동적 웹사이트 이용가능하게끔 하는 것이 script 언어이다 현재는 많은 버전이 나왔는데 ECMA Script 6 문법을 표준으로 사용되며, JQuery 없이도 모든 브라우저에 적합한 것을 만들 수 있다. * SPA : Single Page Application * React : 필요한 부분만 업데이트하는 웹 프레임워크 2. developer.mozilla.org -> 자바스크립트 공식사이트 자바스크립트를 html과 연동하는 방법 1. head안에 script를 포함한다. : page load가 오래걸린다. 2. body 맨 아래에 script를 포함한다. : page content를 빨리 볼 수 있다. 하지만 정상적인 페이지가 나올 때까지 fet..

  Read More