How to change Bootstrap 4 tooltip opacity?

Question

What do I need to target to change the opacity for Bootstrap 4? I found that I need to target this to affect its background, but when I add opacity:1 to tooltip-inner or tooltip, it does nothing:

.tooltip .tooltip-inner {
  background-color: #014379;
}

.tooltip .arrow:before {
  border-top-color: #014379;
}

What do I need to do to change it? Thanks!

Answer 1

You can change the opacity of tooltip like this

.tooltip.show {
    opacity: 0.5;
} 

Answer 2

If you've tried tried this code

.tooltip.show /* The CSS classes that the tooltip has */ {
    opacity: 0.5; /* or whatever */
}

Then try to add !important, so that you can be sure that your style will be applied

opacity: 0.5 !important;

If it still doesn't work, feel free to tell me.