meta name="naver-site-verification" content="ae4cae44dcaf70f327af01a4817e8b3936153eaf" /
kangwon123 님의 블로그
._my-button {
/* 위 아래 거리 */
margin-top: 30px !important;
margin-bottom: 30px !important;
/* 글자 크기 */
font-size: 25px !important;
/* 글자 굵게 (사용한 폰트에 따라 적용이 될 수도 안될 수도 있음) */
/* 100 ~ 900 (일반적으로 500) */
font-weight: 700 !important;
/* 가로 크기 */
/* 글자 크기만큼 줄이려면 fit-content */
width: fit-content !important;
/* 버튼 안의 상하 / 좌우 여백 */
padding: 12px 50px !important;
/* 글자색 */
color: white !important;
/* 배경색 */
background-color: rgb(255, 69, 69) !important;
/* background: linear-gradient(to right, rgb(88, 166, 255), rgb(117, 67, 255)); */
/* 테두리 */
border-style: solid !important; /* 모양 */
border-width: 4px !important; /* 두께 */
border-color: rgb(202, 77, 77) !important; /* 색깔 */
/* 글자에 밑줄 넣을지(underline), 말지(none) */
text-decoration: none !important;
/* 테두리 둥근 정도 */
border-radius: 100px !important;
/* 애니메이션 동작 */
transition-duration: 0.3s !important;
/* 버튼 그림자 */
box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.4) !important;
/* 텍스트 그림자 */
text-shadow: 2px 4px 6px rgba(0, 0, 0, 0.2) !important;
._my-button {
/* 위 아래 거리 */
margin-top: 30px !important;
margin-bottom: 30px !important;
/* 글자 크기 */
font-size: 25px !important;
/* 글자 굵게 (사용한 폰트에 따라 적용이 될 수도 안될 수도 있음) */
/* 100 ~ 900 (일반적으로 500) */
font-weight: 700 !important;
/* 가로 크기 */
/* 글자 크기만큼 줄이려면 fit-content */
width: fit-content !important;
/* 버튼 안의 상하 / 좌우 여백 */
padding: 12px 50px !important;
/* 글자색 */
color: white !important;
/* 배경색 */
background-color: rgb(255, 69, 69) !important;
/* background: linear-gradient(to right, rgb(88, 166, 255), rgb(117, 67, 255)); */
/* 테두리 */
border-style: solid !important; /* 모양 */
border-width: 4px !important; /* 두께 */
border-color: rgb(202, 77, 77) !important; /* 색깔 */
/* 글자에 밑줄 넣을지(underline), 말지(none) */
text-decoration: none !important;
/* 테두리 둥근 정도 */
border-radius: 100px !important;
/* 애니메이션 동작 */
transition-duration: 0.3s !important;
/* 버튼 그림자 */
box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.4) !important;
/* 텍스트 그림자 */
text-shadow: 2px 4px 6px rgba(0, 0, 0, 0.2) !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin-left: auto !important;
margin-right: auto !important;
cursor: pointer !important;
opacity: 1 !important;
transition-property: all !important;
line-height: 1.5 !important;
text-align: center !important;
white-space: nowrap !important;
overflow: hidden !important;
}
._my-button:hover {
transform: scale(1.2) !important;
background-color: rgb(96, 170, 255) !important;
border-color: rgb(74, 143, 223) !important;
}
Box Shadow 꾸미기 사이트
https://getcssscan.com/css-box-shadow-examples
