How can i erase text in first element while i want to see that text in hover element ?

Question

<h1>Name</h1>.

so in css, h1 { }(i don't want to see name on this element ). and h1:hover { }( i want to see name when i am gonna hover on this element).

But the name is showing the first element, how can i erase that ?

Answer 1

To achieve the effect of hiding the text content of an h1 element and then showing it on hover, you can use CSS visibility property and set it to hidden by default and then change it to visible on hover.

Here's an example CSS code:
h1 {
visibility: hidden;
}

h1:hover {
visibility: visible;
}
This code sets the visibility property of h1 element to hidden by default, which will hide the text content of the element. When you hover over the h1 element, the :hover pseudo-class is applied, which changes the visibility property to visible, making the text content visible.