Hi All
I would like to write some custom code to change the background color of a paragraph from dark grey to light grey when you hover over it with the mouse. I have had a look in the standard animations, ad whilst there is a hover selector for the element there isn’t the animation I require available (there just set animations like bounce, flash, pulse…etc). Please can anyone give me a pointer on how to achieve this. I have tried adding it to the attributes as an additional style attribute and could not get it to work
Many thanks
Michael
p:hover {background-color:#e1e1e1;color:black!important;}
p {background-color: #303030;color: white;}
add that to your styles.css
2 Likes
Worth noting: what you’ve requested (and @kuligaposten so graciously provided you) is not an “animation”, it’s called a CSS pseudo class state.
https://www.w3schools.com/css/css_pseudo_classes.asp
The reason it’s not available as an option within Bootstrap Studio is because 1) it’s already built-into most Bootstrap components that change their appearance when hovered over (like buttons, links, etc…) and 2) it’s a very basic, standard part of CSS that you’ll find covered in any CSS instructional class or tutorial.
At the bare minimum, I would highly recommend you follow this tutorial…
https://www.w3schools.com/css/default.asp
Knowing how to write CSS is more or less an indispensable skill if you plan to do much website development with Bootstrap Studio.
Many thanks kuligaposten for your help, Much appreciated
1 Like