활용 사례
home
회사 브랜딩
home

Custom head navigator

<head> <style> .notion-app { padding-top: 56px; } .custom-navbar { position: fixed; top: 0; display: flex; align-items: center; width: 100%; height: 56px; background-color: #ffffff; z-index: 100000; } .custom-navbar-logo { height: 24px; margin-left: 16px; margin-right: 16px; } .custom-navbar > a { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 16px; color: #000000; font-weight: 600; flex: 1; text-decoration: none; transition: 300ms; } @media (max-width: 414px) { .custom-navbar-logo { display: none; } .custom-navbar > a { font-size: 14px; } } </style> </head> <body> <div class="custom-navbar"> <div class="custom-navbar-logo"> <a href="https://www.oopy.io"> <img src='https://app.oopy.io/static/media/oopy_logo_horizontal.54e14e68.png' alt='logo' style='height: 24px;'/> </a> </div> <a href='/'>Home</a> <a href='/guide'>Guide</a> <a href='/qna'>Q&A</a> </div> </body>
HTML
복사