전체 글212 편집창과 터미널창 command + ;로 왔다갔다하기 https://velog.io/@ash/VSCode%EC%97%90%EC%84%9C-editor-terminal%EA%B0%84-%EC%BB%A4%EC%84%9C-%EC%9D%B4%EB%8F%99-%EB%8B%A8%EC%B6%95%ED%82%A4-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0 VSCode에서 editor, terminal간 커서 이동 단축키 설정하기 마우스 의존도 떨어뜨리기 +1 velog.io 2021. 7. 13. 리액트 자습 2일차 : 리액트 시작 내가 사용하려고 하는 컴포넌트를 하나 만들어준다. Hello.js로 같은 경로에 파일을 하나 만들어주고 아래와 같이 코드를 짠다. import React from 'react'; function Hello() { return 안녕하세요; } export default Hello;기본적으로 있는 App.js에서 필요없는 부분들은 덜어내고 위에서 작성한 Hello.js를 표현한다. 표현하는 방법은 이런식으로 나타낸다. import React from 'react'; import Hello from './Hello'; function App() { return ( ); } export default App;index.js 이제 index.js를 봐보자. documen.. 2021. 7. 13. VSCode 터미널 폰트 변경 나는 네이버에서 제작한 D2Coding을 선호하는 편이다. 설정으로 들어가서 termianl font를 검색하고 integrated terminal font 입력하는 란에 D2Coding을 쳐준 뒤 VSCode를 종료하고 재실행한다. 2021. 7. 13. 2일차 : CSS float과 clear Float float을 이용해서 아래와 같은 형태를 만들 수 있다. 좌측 이미지 부분이 될 박스는 float: left로 띄운 것이고 이미지 아래의 Lorem 부분은 새로 div로 감싸주고 clear:left 속성을 주었다. float:left를 지워준다는 뜻으로 clear: left를 줘서 위 이미지 박스부분에서 주었던 float: left를 지워준다. 만약, 위 이미지박스에서 float:right를 주었었다면 clear:right로 지워준다. ✅ 만약 다음 요소에 clear를 사용해서 float을 해제해주지 않는다면 어떤일이 벌어질까? 아래 이미지처럼 겹쳐져서 나타날 수 있다. 이 현상을 해결하려면 마지막에 추가한 노란색 박스에다가 clear:left를 줘서 float을 해제해준다. 많이 사용하는 방.. 2021. 7. 13. 2일차 : CSS display, overflow, line-height, font-family, 색상 Display block과 inline은 설명 생략. inline-block은 inline이지만 block처럼 크기를 가질 수 있고 패딩. 마진값을 가질 수 있게 한다. Overflow 기본값은 visible. 넘친 부분을 자르지 않고 그대로 보여준다. hidden : 넘친 부분 잘라내고. 보이지 않게 한다. scroll : 넘친 부분 잘라내고. 스크롤 내리면 볼 수 있다. auto : 넘친 부분이 있을 때만 잘라내고. 스크롤 내리면 볼 수 있다. (넘치지 않으면 스크롤이 없다.) Line-height 값 자체를 명시해줄수도 있지만 폰트 크기에 비례해서 2배 커지고 싶다고 하면 단순하게 lineheight: 2; 를 적어주면 된다. 일반적으로 1.4 ~ 1.7 배수 정도를 추천한다. Font-family.. 2021. 7. 13. 2일차 : CSS reset, 단위, 박스모델, 마진(중복), 패딩, box-sizing RESET reset.css cdn으로 구글에서 검색해서 첫번째 링크에 들어간 뒤 해당 파일을 copy HTML한다. 내가 만든 css에는 불러온 링크 그 다음줄에 입력해야 덮어쓰기로 내가 원하고자하는 CSS가 나온다. 단위 %는 부모요소를 기준으로 영향 받는다. em은 자기자신의 폰트 사이즈에 영향을 받는다. 예로 font-size가 10px일 때 width를 60em으로하면 600px이다. 추가로 부모에서 font-size를 10px했을 때 자식요소에서 font-size를 2em으로하면 2배가 되서 20px이다. rem태그는 html에 font-size만을 영향받아서 가져온다. 관리하기 어려울 때 이 방법이 좋다. 용이하게 사용하려면 html태그에 font-size를 10px로 했다고 가정했을 때 b.. 2021. 7. 13. 이전 1 ··· 4 5 6 7 8 9 10 ··· 36 다음
