📌 1일차
멋쟁이 사자처럼 프론트엔드 스쿨 2기에 합격하게 되어 3월 28일부터 8월 1일까지 4개월간 좋은 동료들과 열심히 달리게 되었다!
1기보다 낮은 선발인원과 함께 높은 경쟁률이었다고 하는데 자부심을 가지고 열심히 학습을 이어나가야겠다..!
📌 TIL
- 폰트 이용하기
@import url(); * { font-family: 'Montseratt'; }
- 브라우저별로 마진과 패딩의 기본값이 다를수 있으므로 0px로 전부 초기화
body { margin: 0px; padding: 0px; }
- 일반적으로 폰트 크기의 160%의 줄간격이 보기에 편하다!
(line-height)
- 한줄에 좌우정렬
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="연습.css"> </head> <body> <div class="float-wrap"> <h3 class="left">안녕하세요</h3> <h3 class="right">이현섭입니다.</h3> </div> <h3 class="text">잘 부탁드립니다!</h3> </body> </html>좌우 정렬 때문에 다음요소 글자가 겹쳐 보이는 현상 발생
float로 지정된 요소는 html에서 둥둥떠다니기 때문에 겹칠 수 있다.
=> 겹치지 않게 하기 위해 가두리를 하나 만들어줘야 한다!
div class="float-wrap"으로 묶어 준 후
overflow : hidden; 적용해주기!
=> 다음에 오는 html 요소들이 float에 영향을 받지 않게 해준다..left { float: left; } .right { float: right; } .float-wrap { overflow: hidden; }
안녕하세요. 프론트엔드 개발자 이현섭입니다.