Lightbox gallery style01

<!DOCTYPE html>
<html>
<head>
	<title>Lightbox-gallery | par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="Lightbox-gallery">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" />
	<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body class="container">
    <div class="row mt-5 mx-auto text-center">
	   <div class="col-12"><h1 class="text-info">Lightbox</h1></div>
	</div>
	<div class="row mt-5 mx-auto">
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/integration-web.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/integration-web.jpg" alt="" title="">
		</a>
	  </div>
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/solution-technique.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/solution-technique.jpg" alt="" title="">
		</a>
	  </div>
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/problematique.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/problematique.jpg" alt="" title="">
		</a>
	  </div>
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/e-learning-developpement.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/e-learning-developpement.jpg" alt="" title="">
		</a>
	  </div>
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/CDN.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/CDN.jpg" alt="" title="">
		</a>
	  </div>
	  <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12 mb-4">
		<a class="example-image-link" href="https://www.nglesson.com/assets/imgs/menu/media-digital.jpg" data-lightbox="example-set" data-title="Name of Product">
		   <img class="example-image img-fluid" src="https://www.nglesson.com/assets/imgs/menu/media-digital.jpg" alt="" title="">
		</a>
	  </div>
	</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>                       
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/js/lightbox-plus-jquery.min.js"></script>
</body>
</html>
.example-image-link img{
	width: 100%;
	height: 250px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
}
.example-image-link img:hover{
    border: 1px solid #000;
}

                                    
Add Remove dynamic rows with dynamic ID of input in HTML table

Add Remove dynamic rows with dynamic ID of input in HTML table

Affichage des images aléatoire avec js

Affichage des images aléatoire avec js

Arrows Defense Game

Arrows Defense Game

Comment intégrer yamli dans une input

Comment intégrer yamli dans une input

Css Page grid layout

Css Page grid layout

Image hover Inspiration styles

Image hover Inspiration styles

Input range slider HTML style03

Input range slider HTML style03

Timeline style02

Timeline style02

Timeline style05

Timeline style05

Triangle Background css 01

Triangle Background css 01

input radio checkbox b4 style

input radio checkbox b4 style

up down tr in table with js

up down tr in table with js