자기소개 페이지 "소개"
나의 자기소개 페이지를 만들었습니다.
자기소개 페이지를 어떤식으로 만들까 생각했는데 제가 좋아하는 인스타그램을 어플형식으로 만들면 재밌을 것 같아서 모바일 인스타그램 형식으로 만들었습니다!!
자기소개보다는 저의 20살 이후의 모습과 나름의 관심사...?를 적었어요 !!
제가 사용하는 아이폰11의 형식으로 만들었습니다.
반응형 웹으로 만들어서 늘리면 비율에 맞게 늘려집니다!! 
하지만 모바일용이라서 늘리면 이상해져서 줄인게 나아요 ~~~
자기소개 페이지 기능
1. 상단바 클릭시 상단으로 이동
아이폰에서는 상단바를 누르면 맨 위로 이동이 됩니다.
그래서 상단바를 a태그로 감싸주고 내부링크식으로 body태그 바로 밑에 링크를 걸어서 상단바를 클릭하면 맨 위로 가게 했습니다.
여기서 문제가 css 를 적용 안하면 
이런식으로 밑에 줄이 생깁니다.
하이퍼링크에 줄이 생기는 것과 같습니다.
그래서 css에 줄을 없애는 코드를 넣었습니다.
text-decoration-line: none;
decoration line 을 none 으로 설정하여 상단바의 생긴 선을 없앴습니다.
2. 스토리 이동
인스타그램 어플을 보면 이런식으로 스토리를 넘길 수 있습니다.
저는 이것을 스크롤 방식으로 구현했습니다.
width: auto;
overflow-x: scroll;
display: flex;
justify-content: space-between;
overflow scroll을 이용해 페이지 내 일정공간에 스크롤을 하나 더 만들었습니다.
자기소개 페이지 참고자료
제가 만들면서 참고한 것 입니다.
1. fontawesome
fontawesome은 아이콘을 유료/무료 로 사용 할 수 있는 사이트입니다.
상단바의 navigation 아이콘,배터리 아이콘 등등 많이 사용했습니다.
html에서 head안에 CDN 코드를 넣고 사용하면 됩니다.
2. google fonts
google fonts 도 무료로 폰트를 사용하게 해주는 사이트입니다.
저는 Noto sans 폰트를 사용했네요.
css에서 import 하고 적용시키면됩니다.
