user image

Mohamed Aboelfotoh
Published in : 2022-02-12

How to separate the background into three divs that can be flipped?

HTML & CSS

I'm trying to add a background to my HTML5 / CSS3 site, however I'd like to divide it into three divs that can flip when the cursor is hovered over.

So, I suppose the best thing to do is to make three divs side by side (the complete area of my screen) and then apply three backgrounds to each of these three divs, each of which is a different part of my background image.

Is there anyone here who could kindly teach me how to do that with a snippet?

Comments

nico Date : 2022-02-19

Best answers

4

Best answers

4

Hello Mohamed did you try the following
 

//www.w3schools.com/cssref/sel_hover.asp

div:hover { background:xxx;}

Leave a comment

Join us

Join our community and get the chance to solve your code issues & share your opinion with us

Sign up Now

Related posts

Flex Box last column break to the next row
Publish date: 2022-02-10 | Comments: 1

Tag: HTML & CSS

Multiple classes in :not() function in CSS
Publish date: 2022-07-25 | Comments: 2

Tag: HTML & CSS

How do custamize my button to give it a bubble look using CSS?
Publish date: 2022-03-04 | Comments: 0

Tag: HTML & CSS

How to align an Textarea in the middle of the webpage
Publish date: 2022-02-27 | Comments: 1

Tag: HTML & CSS

Searching for a better way to use abstracts in Dart SASS
Publish date: 2022-02-10 | Comments: 0

Tag: HTML & CSS

Logo shrinks when resizing the browser
Publish date: 2022-02-10 | Comments: 2

Tag: HTML & CSS

Sticky header goes behind the Images
Publish date: 2022-02-10 | Comments: 1

Tag: HTML & CSS

Is OOCSS still a good CSS architecture in 2022?
Publish date: 2022-02-08 | Comments: 2

Tag: HTML & CSS