그린그린티라떼

1) VSCode의 왼쪽 메뉴에 있는 확장 프로그램 Code GPT를 검색해서 설치해줍니다. 2) Code GPT 설정으로 가서 API Key를 클릭해서 브라우저를 띄웁니다. 3) 브라우저에 들어가서 로그인을 하면 API key를 발급받을 수 있습니다. 4) Key값을 만들어 복사해주세요. 5) 다시 VSCode로 돌아와 Set API KEY를 선택해주세요. 6) API KEY를 넣어 줍니다. 7) test.js 파일을 하나 만들어서 주석으로 궁금한 질문을 입력합니다. cmd + shift + p 를 눌러 실행시킵니다. 아래와 같은 경우 질문을 잘 수행하지 못했을 때의 결과물입니다. 8) Implement token authentication method membership registration log..

https://sketch.metademolab.com/canvas Animated Drawings sketch.metademolab.com AI로 재미있는 걸 만들어주는 사이트가 생겼다 지율이 귀여워🥰🥰 https://sketch.metademolab.com/share/d6a0cbbc69a84d09b93df762651bfaa7/standard_walk

px - Pixels Absolute Lengths % - percentages Viewport Lengths & Font-Relative Lengths rem - root em Font-Relative Lengths em - em vh - viewport height 현재 보이는 화면에 대한 길이(Viewport Lengths) vw - viewport width 현재 보이는 화면에 대한 길이(Viewport Lengths) feat. vmin, vmax 등도 있음 어떤 프로퍼티를 사용해야 되는지? 박스 모델 프로퍼티? font-size, padding, border, margin, width, height, top, bottom

ul.no-bullets { list-style-type: none; /* Remove bullets */ padding: 0; /* Remove padding */ margin: 0; /* Remove margins */ } Default list: Coffee Tea Coca Cola Remove bullets, margin and padding: Coffee Tea Coca Cola 결과 Default list: Coffee Tea Coca Cola Remove bullets, margin and padding: Coffee Tea Coca Cola

저는 Itrem2를 터미널 창으로 잘 사용하고 있는데요 VSCode와 Iterm2 연동을 할 때 꼭 해줘야 되는 작업이 있습니다! code . 명령어를 써서 VSCode를 직접 여는 수고로움을 더는 작업을 꼭 해주어야 편한 개발 환경 세팅이 되겠죠?! VScode의 settings(cmd + shift + P)에 code를 검색하면 Shell Command: Install 'code' command in PATH를 눌러 설치해줍니다. 이 작업을 하고 시스템 종료 후 다시 위와 같이 code .로 VSCode를 키려고 하면 code라는 명령어가 없다는 문구가 뜹니다. 해결 방법은 아래와 같습니다. .zprofile을 수정해주는 작업이 꼭 필요하니까 아래의 명령어 잘 붙여넣기 해서 편리한 개발 환경 세팅 완..

The Box Model - margin, border, padding, content Styling Width & Height - px or % (or other units) - % refers to container - width and height - box-sizing can be content-box(default) or border-box Pseudo Classes & Elements :hover :active :first-of-type ::after ::first-letter The "display" Property - control behavior(block vs inline) of elements - Mix behavior via inline-block - Remove elements v..

h1태그는 Selector color, background-color등을 property blue, yellow등의 값은 value 위와 같은 형태로 작성한다. 자주 쓰이는 properties에는 color, backgroud-color, display, padding, border, margin, width, height 등이 있다.

.main-nav__item a:hover, .main-nav__item a:active { color: white; } 결합자와 관계없이 하나의 규칙으로 그룹화 가능 더 보기 좋게!

.main-nav__item a { text-decoration: none; color: #0e4f1f; } .main-nav__item a:hover { color: white; } .main-nav__item a::after { content: ' after'; color: pink; } navbar에 들어있는 a태그만 style 변경해줄 때 이런 식으로 주면 깔끔하다.

block 요소는 블록 요소 상자를 생성하여 전후에 줄 바꿈을 생성해준다. inline 요소는 앞이나 뒤에 줄 바꿈을 생성하지 않는 하나 이상의 인라인 요소 상자를 생성한다. 정상적인 흐름에서는 공간이 있으면 다음 요소가 같은 줄에 있다. inline-block 요소는 단일 인라인 상자인 것처럼 주변 콘텐츠와 함께 블록 요소 상자를 생성합니다. inline과의 주요 차이점은 요소에 너비와 높이를 설정할 수 있다는 것이다. block과의 가장 큰 차이점은 요소 뒤에 줄 바꿈을 추가하지 않기 때문에 요소가 다른 요소 옆에 놓일 수 있다는 것이다. See the Pen Untitled by syoungee (@syoungee) on CodePen.