인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

Inflearn Community Q&A

kod378's profile image
kod378

asked

Bootstrap 5 - Creating a Web Project from Scratch

Project 1 - Intro Section

a:hover {color }

Written on

·

316

2

질문글을 작성하다가 원인을 찾아서 문제해결했습니다만, 추후 다른 분께 도움이 될까 봐 간략하게 올립니다.

  • 문제

#intro .intro-first-card .overlay a:hover {
  color: #fafa6f;
}

위 코드가 동작하지 않았습니다.

  • 원인

bootstrap.min.css 버전에 따른 .link-light 차이

강의&수업자료 버전은bootstrap@5.0.2/dist/css/bootstrap.min.css을 사용 .link-light {color: #f8f9fa;}

제 버전은 bootstrap@5.2.1/dist/css/bootstrap.min.css .link-light {color: #f8f9fa!important;}

  • 해결

#intro .intro-first-card .overlay a:hover {
    color: #fafa6f !important;
}

 

HTML/CSSjavascript웹 디자인bootstrap

Answer 4

0

transition: color .4s ; 

color 로 지정하니까 정상적으로 되네요

0

네 감사합니다.

다시 한번 해보겠습니다.

0

감사합니다.

그럼 해결방법이 옆에 !important 를 붙이는건가요?

버전을 바꿔야 하나요?

여러가지를 해봐도 hover가 작동하지 않습니다.

 image

kod378님의 프로필 이미지
kod378
Questioner

강의버전이랑 같은 bootstrap.min.css을 사용하시면 !important를 안쓰셔도 됩니다.

커스텀한 css파일에 !important를 추가하셨는데도 작동하지 않으신다면 브라우저 개발자모드에서 어떤 css를 사용하는지 직접 확인하셔야할 듯 합니다.

0

codingdiy님의 프로필 이미지
codingdiy
Instructor

감사합니다.^^

kod378's profile image
kod378

asked

Ask a question