felhasználói visszajelzések
Hibaüzenet
Etiam neque felis, blandit nec justo nec, sagittis viverra augue.
html
<div class="alert alert-danger" role="alert" aria-live="assertive" aria-atomic="true" aria-describedby="alertText"> <p id="alertText">Etiam neque felis, blandit nec justo nec, sagittis viverra augue.</p> </div>
css
.alert-danger { background-color: #c20029; border-color: #c20029; color: #fff; } .alert p { margin: 0; }
Sikeres üzenet
Etiam neque felis, blandit nec justo nec, sagittis viverra augue.
html
<div class="alert alert-success" role="alert" aria-live="assertive" aria-atomic="true" aria-describedby="alertText"> <p id="alertText">Etiam neque felis, blandit nec justo nec, sagittis viverra augue.</p> </div>
css
.alert-success { color: #fff; background-color: #5F853B; border-color: #5F853B; top: 60%; } .alert p { margin: 0; }
Figyelmeztető szöveg
Figyelem!
Felhívjuk figyelmét, hogy Duis velit augue, sollicitudin quis leo eget, ultrices scelerisque ligula. Fusce scelerisque urna sapien, sit amet sollicitudin augue sodales sed. Sed vel varius urna, rhoncus sodales leo. Nam tincidunt mauris in pulvinar mattis. Integer in ultrices quam. Donec aliquet dolor sed metus accumsan, et semper lorem tempus. Proin feugiat quam ac finibus laoreet. Pellentesque porttitor porta eros, ut malesuada leo luctus vitae.
html
<h4 class="text-danger"><strong>Figyelem!</strong></h4> <p class="text-danger">Felhívjuk figyelmét, hogy Duis velit augue, sollicitudin quis leo eget, ultrices scelerisque ligula. Fusce scelerisque urna sapien, sit amet sollicitudin augue sodales sed. Sed vel varius urna, rhoncus sodales leo. Nam tincidunt mauris in pulvinar mattis. Integer in ultrices quam. Donec aliquet dolor sed metus accumsan, et semper lorem tempus. Proin feugiat quam ac finibus laoreet. Pellentesque porttitor porta eros, ut malesuada leo luctus vitae.
css
.text-danger { color: #c20029; }