티스토리 뷰

티스토리를 하다보면 정보글이 많기 때문에 링크를 연결하는 경우가 많은데요. 깔끔하게 버튼을 만들어서 연결하는 방법을 안내해드립니다.

 

우선은 관리에 서식만들기로 들어가서 아래의 코드를 html로 변경한뒤에 입력해주세요. 

<style>
  a.link-button {
    margin: 15px 0;
    padding: 12px 20px;
    display: inline-block;
    text-decoration: none;
    text-align: center;
    box-shadow: 0 6px 12px rgb(134 140 150 / 65%);
    color: #fff; /* 글자색*/
    font-size: 18px; /* 글자 크기 */
    font-weight: 700; /* 글자 굵기 400 또는 700 또는 삭제 */
    border-radius: 4px; /* 버튼 라운드 크기 4 ~ 100 */
    background-color: #0089ff; /* 배경색 */
  }
  a.link-button:hover {
    opacity: 0.8;
  }
</style>

<a class="link-button" href="#">링크 버튼</a>

그럼 링크버튼이 생깁니다.