CSS - When to click change another element

Asked

Viewed 476 times

1

I wanted to know how to do so that when I click the H1 button change to the red color, only with css

<!DOCTYPE html>
<html>
<head>
	<style type="text/css">
		button:active + h1 {
			color: red;
		}
	</style>
</head>
<body>
	<h1>OI</h1>
	<button>X</button>
</body>
</html>

1 answer

3


You can do this using the Checkbox Hack:

/* Checkbox Hack */
#toggle-1 {
   display:none;
}

label { 
  -webkit-appearance: push-button;
  -moz-appearance: button; 
  display: inline-block;
  cursor: pointer;
  padding: 5px;
}


/* CSS quando o checkbox está marcado */
#toggle-1:checked ~ #cabecalho {
   color:Red;
}
<label for="toggle-1">
  Clique aqui
</label>
<input type="checkbox" id="toggle-1">
<h1 id="cabecalho">Texto</h1>

  • 1

    Show! very good. Thanks for your help.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.