인프런 커뮤니티 질문&답변

kod378님의 프로필 이미지

작성한 질문수

부트스트랩 5(Bootstrap 5) - 기초부터 웹 프로젝트 만들기

프로젝트 1 - Intro Section

a:hover {color }

22.09.27 20:58 작성

·

264

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;
}

 

답변 4

0

신문규님의 프로필 이미지

2024. 03. 22. 20:08

transition: color .4s ; 

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

0

ljinh0717님의 프로필 이미지

2022. 11. 08. 15:12

네 감사합니다.

다시 한번 해보겠습니다.

0

ljinh0717님의 프로필 이미지

2022. 10. 20. 13:22

감사합니다.

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

버전을 바꿔야 하나요?

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

 image

kod378님의 프로필 이미지
kod378
질문자

2022. 11. 06. 21:35

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

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

0

Self-coding님의 프로필 이미지
Self-coding
지식공유자

2022. 09. 28. 16:14

감사합니다.^^

kod378님의 프로필 이미지

작성한 질문수

질문하기