코드 정리/코드 정리 - Tistory
티스토리 홈 + 로그인/로그아웃 버튼 만들기
분석가 황규진
2024. 7. 5. 10:30
<s_sidebar_element><!-- 로그인/로그아웃-->
<div class = "sidebar-element">
<div class = "logout-menu test-sm">
<div><a href="https://www.tistory.com">티스토리 홈</a></div> | <div class="login-logout-button"></div>
</div>
</div>
</s_sidebar_element>
.logout-menu {
display: flex; /* 기본적으로 표시 */
flex-direction: row; /* 가로 배치로 설정 */
justify-content: flex-start; /* 왼쪽 정렬 */
gap: 10px; /* 요소들 사이 간격 */
padding-left: 25px; /* 오른쪽으로 약간 이동 */
}
.logout-menu a {
text-decoration: none; /* 링크의 밑줄 제거 */
color: #aaa; /* 기본 글자 색상 유지 */
padding: 5px 10px; /* 패딩 추가 */
border: none; /* 테두리 제거 */
background-color: transparent; /* 배경색 제거 */
font-size: inherit; /* 글자 크기 통일 */
}