Inflearn Community Q&A

asked

Bootstrap 5 - Creating a Web Project from Scratch

Project 1 - Intro Section

a:hover {color }

Written on

451

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

#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

Quiz

55% of people got it wrong. Give it a try!

프로젝트 초반 설정 단계에서 Bootstrap이나 Font Awesome 같은 외부 라이브러리를 프로젝트에 추가하는 일반적인 방법은 무엇일까요?

라이브러리 파일을 직접 다운로드하여 assets 폴더에 저장한다.

CDN(Content Delivery Network) 링크를 HTML 파일의 <head> 또는 <body> 하단에 추가한다.

별도의 빌드 도구를 사용하여 프로젝트에 포함시킨다.

라이브러리의 필요한 부분만 복사하여 커스텀 CSS/JS 파일에 붙여넣는다.

Answer 4

transition: color .4s ; 

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

네 감사합니다.

다시 한번 해보겠습니다.

감사합니다.

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

버전을 바꿔야 하나요?

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

Questioner

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

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

Instructor

감사합니다.^^

asked