Bulma is a free and open-source CSS framework that ships with premade components and elements. It makes the development of websites very fast as you do not have to style everything from scratch.
The Bulma Delete element can be used with other elements to make different User Interfaces. Bulma itself uses it inside tags, notifications, and messages.
Syntax:
<span class="tag is-danger">
Operation Unsuccessful
<button class="delete"></button>
</span>Example: The Below example illustrates how the delete element is used in combination with other elements.
HTML
<!DOCTYPE html> <html>
<head>
<title>Bulma Delete Combinations</title>
<link rel="stylesheet" href=
<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 Combinations</b>
<div class="container">
<div>
<span class="tag is-danger">
Operation Unsuccessful
<button class="delete"></button>
</span>
</div>
<div class="notification is-success">
<button class="delete"></button>
GeeksforGeeks is a computer science portal for geeks.
It provides articles and videos on different
topics like Data Structures, Algorithms, DBMS,
Computer Network etc.
</div>
</div>
</body>
</html>
|
Output:
Reference: https://bulma.io/documentation/elements/delete/#combinations