×

앱 설치 안내

리빌더 공식 홈페이지 바로가기를 PC에 설치해보세요!
바탕화면에서 앱으로 실행할 수 있어요.

질문과 답변

2024.09.27 08:14

일반 페이지에 강조컬러 적용은 어떻게 하나요?

페이지를 만들고 있는데 레이아웃에 있는 강조색상을 바꾸면 페이지에 있는 버튼이나 DIV 배경도 그 색상으로 같이 바뀌게 하고 싶은데 어떻게 적용하면 될까요?
  • 공유링크 복사
    미니홈 쪽지 구독하기
    구독하고 알림받기

    댓글목록

    profile_image
    HUMHAE미니홈 1:1 대화하기  오래 전

    공식 답변은 아니지만... 남겨봅니다.

    https://홈페이지주소/rb/rb.css/set.color.css 를 확인하시면
    배경색, 글자색, 테두리색 등에 대한 컬러를 지정하는 css가 보이실겁니다.



    .co_강조컬럭색상코드 .main_rb_bg {background-color:#AA20FF;} /* 강조컬러 배경색상 */
    .co_강조컬럭색상코드 .main_rb_color {color:#AA20FF;} /* 강조컬러 글자색상 */
    .co_강조컬럭색상코드 .main_rb_bordercolor {border-color:#AA20FF;} /* 강조컬러 테두리색상 */



    리빌더의 경우 <main> 시맨틱마크업에 강조컬러 색상에 대한 클래스를 명시하고 있습니다.

    <main class="co_00A3FF co_header0" id="main">

    그럼 해당 main 태그 안에서는 위의 css를 원하는곳 어디서든 다 적용할 수 있게됩니다.
    (임의로 !important를 명시한 곳을 제외하고)



    예를들어, 기존
    <div class="text">글자</div>
    라고 되어있는 곳에 글자 색을 강조 색상을 적용하고 싶다면, 아래와 같이 변경해보세요.

    <div class="text main_rb_color">글자</div>

    위와 같이 background-color 등에 대한 속성을 잘 찾으셔서 해당 class만 주입해주면 됩니다.

    2024-09-27 09:11

    profile_image
    HUMHAE미니홈 1:1 대화하기  오래 전

    추가적으로 페이지를 만들고 계시다고 하셔서 한 가지 더 알려드리자면,
    글자에 대한 속성도 기본적인것은 이미 리빌더에 명시가 되어있습니다.
    (생각보다 리빌더에서 많은 부분을 생각하신 것 같더라구요.)

    통일성을 생각하신다면 기존의 css에서 참고하여 페이지를 구성하시는데에 도움이 되실 수 있을 것 같습니다.


    https://홈페이지주소/theme/rb.basic/rb.css/reset.css를 확인하시면
    .font-R, .font-B, .font-H, .font-8, .font-22 등등

    또한 무채색 색상에 대한 여러 코드도 있으니 css를 확인해보시면 좋을 것 같습니다.
    .color-fff, .color-ddd, .color-111


    언젠가 리빌더 사용가이드의 커스텀 가이드에 해당 내용들이 추가되지 않을까 기대해봅니다.

    2024-09-27 09:27

    profile_image
    리빌더미니홈 1:1 대화하기  오래 전

    정확한 답변 고맙습니다.
    라이브러리 에서 해당 내용들을 다룰 예정입니다.

    감사합니다.

    2024-09-27 13:19

    profile_image
    Leegun미니홈 1:1 대화하기  오래 전

    답변 감사합니다. 퇴근하고 한번 확인해 봐야 되겠네요. ㅎㅎ  HUMHAE님 말씀 들어보니 정말 신경을 많이쓴 빌더인게 느껴지네요.

    2024-09-27 11:04