HTML/CSS
1.TIL 01 | HTML Basics
Udemy의 Web developer 과정을 들으면서, 겉햝기로 배워왔던 HTML과 CSS를 제대로 공부하기 시작했다. HTML과 CSS에서 놓치기 쉬운 포인트들을 다시 한번 정리해보자!HTML은 우리가 흔히 생각하는 '명사', CSS는 이를 꾸며주는 '형용사', 이후
2.TIL 02 | HTML, form과 input
HTML에서 빠질 수 없는 Form과 Input 태그에 대해서 알아보자! <form> 은 사용자가 입력한 데이터를 서버로 전송하기 위해 사용한다. action - where the form send data tomethod - the type of HTTP req
3.TIL 03 | CSS Basics
Css 에서의 주석처리는 아래와 같이 작성한다.헤더에 link로 css 파일을 연결한다.3 channels: Red, Green and Blue.Each ranges from 0 - 255rgb(0,0,0)alpha(투명도 transparency) channel. Ra
4.TIL 04 | font of CSS
구글폰트(https://fonts.google.com)에서 원하는 폰트, weight를 선택후, 링크를 카피해서 HTML <head> 안에 붙여넣으면 CSS에서 사용이 가능하다.
5.TIL 05 | CSS Layout Basics
CSS에서 가장 헷갈리는 레이아웃을 다시 정리해본다. 본 TIL은 https://ko.learnlayout.com 의 'CSS 레이아웃을 배웁시다'를 바탕으로 작성되었다. (작성하다보니 거의 복붙이 되어버렸다...)display 는 CSS에서 레이아웃을 제어하
6.TIL 06 | Bootstrap
Bootstrap을 적용하는 방법에는 두가지가 있다.1\. html과 같은 폴더에 bootstrap.css 를 넣고 link를 걸기2\. 외부링크를 가져와서 삽입하기전체 레이아웃을 잡아준다.요소간 간격을 적절하게 잡아준다.요소가 같은 줄에 올 수 있도록 해준다.butt
7.TIL 07 | 자기소개 페이지 만들기 리뷰
'HTML/CSS'로 자기소개 페이지 만들기! 코드를 짜보면서 구글링을 통해 새로 배운 것들, 오류들, 여전히 해결하지 못한 부분을 정리해보자
8.TIL 08 | 자기소개 페이지 그룹 리뷰
7월 18일, 위코드 사전스터디 첫 모임에서 피드백 받은 내용, 새로 알게 된 내용을 정리한다.페이지의 링크를 보냈을 때, 미리보기로 나타나는 제목과 사진, 설명을 설정할 수 있는 기능이다.페이지 탭에 작게 뜨는 이미지를 설정할 수 있다.스크롤을 할 때 배경의 사진을
9.TIL 09 | Bootstrap 4! 타이포그래피와 레이아웃
rem 을 사용하면 비율에 따라 크기를 설정할 수 있다.1 rem = 16px2 rem = 32px.display-1 = 6remdisplay 클래스를 사용하여 더 큰 제목용 타이포그래피를 사용할 수 있다.<blockquote class="blockquote">로
10.TIL 21 | HTML/CSS +α
wecode에서 새롭게 알게된 HTML/CSS 내용을 보충하여 작성한다.<span>에는 오른쪽 정렬이 되도록 클래스를 부여해도 오른쪽 정렬이 되지 않는다. 이는 <span>이 inline-element이기 때문에, <span>이 차지하는 영역은 "<
11.CSS Layout
HTML에서는 static 포지션이 기본값이다. 이는 HTML이 작성된 순서대로 나열이 되어있는 형태를 의미한다. 원하는 위치에 요소들을 배치하기 위해서는 relative, absolute, fixed와 같은 position 속성을 부여해주어야 한다.relative는
12.TIL 35 | CSS Flexible Box
Flexbox 연습하는 사이트 : https://flexboxfroggy.com/#ko