TIL 04.19(CSS)

Lee Jooam·2022년 4월 19일
0

CSS(0) 요소 선택하기

CSS에 대한 내용을 학습했다.

HTML과 CSS는 보통 쉽다고 인식된다. 그리고 깊이에 따라 다르겠지만 다른 프로그래밍 언어에 비해 접근성이 좋은 건 사실이다.

하지만 그게 중요하지 않다는 의미는 될 수 없다.

웹 서비스의 첫인상을 담당하는 핵심 요소인 만큼 프로그래밍 언어에 못지 않게 잘 활용해야한다.

새로 알게 된 내용

padding

padding은 내부의 여백을 설정한다. 그리고 그 크기 만큼 박스의 크기를 늘린다. 사실 이 내용은 언젠가 한번 들었던 내용이지만, 여태 잊고 있었다.

항상 box-sizing을 border-box로 설정했기 때문이다. 혹시 모를 상황을 대비해 인식하고 있자.

normal, medium...

CSS에는 여러 고정 값들이 등장한다. 폰트의 normal, medium, bold, 색깔의 red, green 등 개발자의 편의성을 높이는 데 큰 도움을 준다.

하지만 브라우저마다 이 값들을 다르게 해석할 수도 있다고 한다. 최대한 수치적인 값을 입력하는 게 좋다.

border-radius

radius, 반지름이라는 뜻이다. 대충 모서리를 깎는 용도라고만 인식했지 그 이름에 담긴 의미는 별로 궁금하지 않았다.

왜 반지름일까? 그것은 모서리로부터 속성에 준 수치만큼 떨어진 곳을 원점으로 생성된 원의 radius에 따라 모서리가 깎이기 때문이다.

전혀 몰랐던 사실이다. 그럼 원점의 위치는 sqrt(수치 * 수치) 만큼 떨어진 거리라고 계산할까?

후기

개인적으로 모든 CSS의 속성들을 외우면서 학습하는 건 비효율적인 행위라고 생각한다. 수많은 속성들을 외우기도 힘들 뿐더러 머릿속으로만 상상하면 기억에 오래 남지 않는다.

개발과 검색은 떼놓을 수 없는 관계같다.

profile
프론트엔드 개발자로 걸어가는 중입니다.

0개의 댓글