Bulma es un marco CSS gratuito y de código abierto que se envía con componentes y elementos prefabricados. Hace que el desarrollo de sitios web sea muy rápido, ya que no tiene que diseñar todo desde cero.
Bulma Delete Size es un elemento independiente que se puede utilizar para varios propósitos. Es solo un círculo con una cruz dentro. El elemento de eliminación de Bulma viene en 4 tamaños diferentes: pequeño, predeterminado, mediano y grande.
Bulma Eliminar clases de tamaño:
- is-small: esta clase se utiliza para hacer que el elemento de eliminación sea de tamaño pequeño.
- is-medium: esta clase se utiliza para hacer que el elemento de eliminación sea de tamaño mediano.
- is-large: esta clase se utiliza para hacer que el elemento de eliminación sea de gran tamaño.
Sintaxis:
<button class="delete is-large"></button>
El siguiente ejemplo ilustra los tamaños de eliminación de Bulma:
Ejemplo: El siguiente ejemplo ilustra el uso de las clases de tamaño de eliminación de Bulma .
HTML
<!DOCTYPE html>
<html>
<head>
<title>Bulma Delete Sizes</title>
<link rel='stylesheet' href=
'https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css'>
<style>
div.container > div {
margin: 20px;
}
</style>
</head>
<body class="has-text-centered">
<h1 class="is-size-2 has-text-success">
GeeksforGeeks
</h1>
<b>Bulma Delete Sizes</b>
<div class="container">
<div>
<span>Normal Size: </span>
<button class="delete"></button>
</div>
<div>
<span>Small Size: </span>
<button class="delete is-small"></button>
</div>
<div>
<span>Medium Size: </span>
<button class="delete is-medium"></button>
</div>
<div>
<span>Large Size: </span>
<button class="delete is-large"></button>
</div>
</div>
</body>
</html>
Producción:
Referencia: https://bulma.io/documentation/elements/delete/#sizes