오늘 한 것
개인 소개 페이지 CSS 수정
개인 페이지 만들기
button
개인 페이지에 sticky 버튼을 구현해 보았다
기본 sticky 버튼 구현
.sticky {
position: -webkit-sticky;
position: fixed;
top: 130px;
left: 140px;
padding: 10px 45px;
background-color: transparent;
border-radius: 30px;
border: 5px solid rgba(246, 210, 125, 0.9);
font-size: 15px;
}
.sticky a {
color: rgb(74, 73, 73);
text-decoration: none;
}
hover을 할 경우 버튼의 사이즈가 커지게 만들었다.
.sticky:hover {
background-color: white;
transform: scale(1.1);
border: 5px solid rgba(255, 213, 130, 0.9);
}
결과
'개발 일지 > TIL' 카테고리의 다른 글
[ 스파르타 / TIL ] 내일배움캠프 #6 (0) | 2022.11.07 |
---|---|
[ 스파르타 / TIL ] 내일배움캠프 #5 (1) | 2022.11.04 |
[ HTML ] box-sizing 및 웹개발 종합반 강의 정리 (0) | 2022.11.03 |
[ HTML ] 미니프로젝트 S.A 및 flex-direction (0) | 2022.11.01 |
[ HTML ] 미니프로젝트 계획 (1) | 2022.10.31 |
댓글