En CSS, el símbolo tilde(~) se conoce como Combinador de hermanos posteriores (también conocido como tilde o garabato o twiddle o selector general de hermanos). Como sugiere el nombre, está compuesto por el carácter “tilde” (U+007E, ~) que separa dos secuencias de selectores simples. Los elementos representados por las dos secuencias comparten el mismo padre en el árbol del documento. Se utiliza para seleccionar todas las segundas secuencias que están precedidas por la primera secuencia (no necesariamente inmediatamente) o, en palabras simples, selecciona todos los elementos que son hermanos de un elemento específico.
Sintaxis:
first-sequence ~ second-sequence {
/* property:value; */
}
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>CSS ~ Selector</title>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1">
<link rel="stylesheet" href=
"https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<style>
h1{
color:green;
text-align: center;
}
hr ~ p {
text-align: justify;
background-color: powderblue;
font-size: 130%;
}
</style>
</head>
<body>
<div class="container">
<h1>GeeksforGeeks</h1>
<p>
Sudo Placement is back to help you this placement
season. Prepare for the Recruitment drive of
product-based companies like Microsoft, Amazon,
Adobe, etc with our free online placement preparation
course. The course focuses on various MCQ's & Coding
question likely to be asked in the interviews & make
your upcoming placement season efficient and successful.
</p>
<hr/>
<p>
Sudo Placement is back to help you this placement
season. Prepare for the Recruitment drive of
product-based companies like Microsoft, Amazon,
Adobe, etc with our free online placement preparation
course. The course focuses on various MCQ's & Coding
question likely to be asked in the interviews & make
your upcoming placement season efficient and successful.
</p>
</div>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por shubhamr238 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA