Reload0213 devNote

position-fixed의 특징 CSS의 position 속성은 엘리먼트가 브라우저 화면에 어떻게 배치되는가를 결정합니다. 어떤 엘리먼트의 position 속성을 fixed로 지정해줄 경우, 해당 엘리먼트는 부모 엘리먼트로 부터 완전히 독립되어 브라우저 화면(viewport) 상에서 어디든지 원하는 위치에 자유롭게 배치시킬 수 있게 됩니다. 뿐만 아니라, 브라우저 화면을 스크롤했을 때도 영향을 받지 않기 때문에, 다른 엘리먼트들이 상하좌우로 움직일 때, position 속성이 fixed로 설정되어 있는 엘리먼트는 그 자리에서 움직이지 않습니다. 상단에 고정되어 있는 메뉴바/네비게이션을 만드는 방법에 대해서 알아보겠습니다. - 우선 상단 메뉴영역과 메인영역을 Html을 통해 간단히 작성해준 후 메뉴바를 ..

1. 비교 연산자 " > ,

1. 혹시나 VS Code의 설정을 잘못 수정하여 단축키가 변경됬는지 확인한다. 2. 위와 같이 단축키엔 아무이상이 없고, 분명 잘되다가 한번씩 갑자기 안되는 경우, 블로그 주인장도 처음 VS Code를 다룰 때 겪은 사례로 주석 단축키는 Ctrl + / 인데, 급하게 타이핑을 하다가 Ctrl키와 /(슬래시) 옆 Shift키를 잘못 누를수 있는데 만약 Ctrl + Shift 키가 입력되면 이는 한컴 입력키 변경 단축키이다. 위 사진과 같이 한컴 입력기 표시가(ㅎ모양과 비슷하게) 되어 있다면 주석 설정 단축키가 실행이 안되는 문제가 발생한다. 3. 화면 아래의 ㅎ(한컴 입력기)모양과 유사한 곳은 클릭하여 Microsoft 입력기를 다시 클릭하여 변경해준다. 다른 간단한 방법으로는 단축키인 Ctrl + Sh..

자료형(Data Type) 기본형(Primitive Type) 참조형 (Reference Type) Number String Boolean Null, Undifind Object 1. 기본형(Primitive Type) let x = 10; let y = x; console.log(x); // 10이 출력 console.log(y); // 10이 출력 y = 20; console.log(x); // 10이 출력 console.log(y); // 20이 출력 - JavaScript에서 어떤 값을 핸들링 할때 기본형 타입은 변수에 값을 할당해서 사용 한다. 즉 변수 이름을 가진 그릇에 그 값을 넣어준다고 할 수 있다. 위 코드의 첫 번째 줄에서 변수 x에 10이라는 값을 할당하였기 때문에, x라는 그릇에 숫..

코드를 작성하고 라이브 서버를 띄우며 확인하다보면 발생하는 오류이다. 기능상의 장애를 일으키는 것은 아니나, 빨간 줄로 에러메세지가 남는게 너무나도 신경 쓰인다. 아이콘이 없거나 경로가 맞지 않으면 오류가 나는 것 같습니다. 해결을 하려면 아이콘을 맞춰주거나 경로를 맞춰주면 되는데, 그게 번거롭다면 위와 같이 head 태그 안에 한 줄만 추가해주시면, 에러가 해결됩니다.

1. 문자열에 사용 ​ 2. 문자열을 정렬할 때 비교할 문자열이 비교대상이 될 문자열의 앞에 오는지, 뒤에 오는지 혹은 같은 순서인지를알려주는 숫자를 return한다. ​ 사용 예시- F12 를 눌러 Console창에서 결과 값을 확인

1. Number : typeof instance === "number" 숫자를 표현하거나 산술 연산을 할 경우 필요한 데이터 타입 기본적으로 +(더하기), -(빼기), *(곱하기), /(나누기) 등의 산술 연산이 가능하며 Math라는 내장 객체를 활용하여 수학함수를 이용한 결과를 얻을 수 있다. 명세에 따르면 숫자의 범위는 -(2^53-1)~(2^53-1) 까지로 명시되어 있으나 사실상 표현되는 숫자는 여러 라이브러리의 사용으로 인해 무한대로 증폭도 가능하다. 정수만을 표현하거나 실수만을 표현하기 위한 자료형은 따로 존재하지 않으며 전부 Number 형으로 통일된다. 9진수나 16진수의 형태의 자료형도 표현이 가능하다. -> F12 를 눌러 Console 창에서 Result 확인 2. Boolean :..

자바스크립트 데이터 화면 및 출력 내용 변경 *● document.write( ) * : ()안에 것을 화면에 출력시키는 method ●w**indow.alert() ** : 경고(알림)창을 띄워 ()안의 것을 출력시키는 method ●*innerHTML=" " * : 예를 가지고 이해하는 것이 빠르다. 예를 들어 HTML로 [ 피카츄 ]이라는 콘텐츠를 화면에 출력하였다. 이 HTML 요소에 접근하여 [ 피카츄 ]을 [ 라이츄 ]으로 바꿔 출력하게 만들려면 이 innerHTML=" " **속성을 사용해야 한다. 그리고 HTML 요소에 접근하려면document.getElementById**메서드를 함께 사용한다. 기본의 피카츄를 출력하는 HTML 요소의 id인 "pikachu"로 접근하여 **innerHT..

Selector : 선택자 HTML의 요소는 Element, CSS은 Property라고 한다. CSS에서 선택자는 HTML의 요소(E)와 조건(F, Filter)을 조합한다. 샘플 코드에서 E는 Element, F는 Filter를 의미한다. Basic selectors : 기본선택자 기본 선택자(basic selectors)의 종류 전체 선택자(Universal selector) ' * ' : 범위 내(요소 내부의), 모든 요소를 선택. => 모든 태그를 대상으로 스타일을 적용할 때 사용(' * '(별)으로 사용) => 주로 태그의 스타일 초기화를 할 때 사용하기도 한다 ex ) * { color: red; } 태그 선택자 (Type selector) : 태그 이름이 E인 요소를 선택. => 특정 태그..

시간이 너무 빠르게 흘러 어느샌가 2주차가 훌쩍 지나버렸다. 1주차는 그래도 미리 예습을 해둔 것이 있어 어느정도 따라가며 수업 후 복습도하고 시간이 남아 예습도하고 블로그 정리도하고 했는데, 본래 대학교의 컴퓨터공학 과 3~4년과정을 6개월안에 배우는 과정이다 보니 진도가 빠르다고는 들었지만, 생각보다 더 빨라서 빡빡하게 복습하고 제대로 소화하는데만 하루가 거의 다 지나버려서 블로그에 복습 정리, 다짐했던 예습 정보처리기사 공부를 하기가 쉽 지 않았다. 무엇보다 2주간의 Html, CSS수업을 듣고 배운 것을 바탕으로 시험을 쳤는데, 60점 이하면 보충수업이라는 말 씀에 시험이 다가오면 올수록 배운 것 부터 확실히 복습하느라 더 시간이 안났던 것 같다. 다행히 결과는 운이 좋게도 기대했던 것보다 잘나와..