자기소개 페이지

jihyun·2021년 8월 14일
0

뚞딲뚞딲

목록 보기
1/5

하고싶은대로 슥삭 뚝딱 만드는 건 아직 멀었다
그래도 너무나 재밌는 것...😃

:hover
마우스오버 시 클릭 유도하기 위해 색 변화 & 크기 확대

내부링크 <a href="#id"></a>

@media screen and (max-width: 768px) -> 처음보는데 반응형을 생각보다 쉽게 할 수 있는 게 신기헀다!

scroll-behavior -> 스크롤 없이 화면이 뚝 뚝 내려갔었는데 간단하게 슬라이드하는 스크롤 설정이 가능했다.

display: flex

flex-direction
row: 요소들을 텍스트의 방향과 동일하게 정렬
row-reverse: 요소들을 텍스트의 반대 방향으로 정렬
column: 요소들을 위에서 아래로 정렬
column-reverse: 요소들을 아래에서 위로 정렬

justify-content, align-items
flex-start: 요소들을 컨테이너의 왼쪽으로 정렬
flex-end: 요소들을 컨테이너의 오른쪽으로 정렬
center: 요소들을 컨테이너의 가운데로 정렬
space-between: 요소들 사이에 동일한 간격
space-around: 요소들 주위에 동일한 간격

이미지 가득 차게 / 비율 변경 없이 남기기 등
background-size : cover / contain 설정

2개의 댓글

comment-user-thumbnail
2021년 10월 13일

오호 이건 예전에 만든 자기소개 페이지인가보네요! 잘보구 갑니다~

1개의 답글