![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/c7y4m1/btrKbtjG4Z7/Pw2Px39CjO8mRvsnEYNcv0/img.png)
파비콘(favicon, favorite icon) 티스토리에서도 확인할 수 있는 파비콘은 따로 설정없이도 화면에 표시된다. 프로젝트의 루트(/)경로에 favicon.ico 라는 이름으로 파비콘으로 설정되길 원하는 아이콘을 저장해 두면 해당 아이콘이 위 티스토리 파비콘처럼 실제로 표시되게 된다. 파비콘을 고해상도(PNG)로 제공하기 위해서는 link 태그로 제공가능하다. (내부에 삽입) 브라우저 스타일 초기화 jsdeliver, cdnjs등에서 link태그로 reset.css를 연결해서 사용할 수 있다. (Eric Meyer's CSS reset.) 오픈 그래프 소셜미디어로 웹페이지를 공유할때 보여지는 정보 여기서 og란 open graph를 뜻한다. 트위터 카드 트위터의 개발자 문서(https://dev..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/xEikv/btrJQ4raHhn/fQoDFaciqkk4AQCf8x9zk0/img.png)
2주차 수업으로 CSS를 더욱 깊이있게 학습해 보는 시간을 가졌다. 여백 (margin, padding) padding : 요소의 내부 공간을 지정 margin : 요소의 외부 공간을 지정 위 이미지의 경우에는 margin-right: 12px; 의 결과라고 할 수 있다. padding, margin 모두 padding: margin: 과 같이 단축하여 작성할 수 있고, margin-top, margin-right, margin-bottom, margin-left(padding-top, padding-right, padding-bottom, padding-left)를 각각 지정할 수 있다. 단축속성으로 작성한 경우 네 영역을 모두 작성한 경우에는 top, right, bottom, left순으로 적용된다..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bGql9c/btrJern0lze/uyKbbN4LX6BPRgD278pcc0/img.png)
이번에 K-디지털 기초역량훈련으로 패스트캠퍼스 프론트엔드 8주 완성 with React를 시작했다. 매주마다 학습일지를 작성하여 나만의 개발노트를 완성해보자!✍ HTML, CSS는 기존에 알고있던 내용에 대해서는 작성하지 않고, 다음 내용들 위주로 정리해 보기로 하자. 알고있었지만, 불확실하였던 내용 이번에 처음 알게된 내용 웹앱의 동작원리 위 1~4 순서로 웹앱이 동작하게 된다. 주소창에 원하는 주소를 입력하면 서버로 HTML을 요청하게 되고, 해당 HTML을 파싱하면서 필요로하는 CSS,JS, 이미지... 등을 추가로 요청하게 된다. 서버는 해당 추가 요청에 대한 추가응답을 해 줄 것이다. 이를 브라우저가 해석하여 사용자 화면에 그려주게 되는(rendering) 것이다. 우리는 1. HTML, CSS..