saii9/temp.txt

## temp.txt
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Image Checkboxes</title>
  <style>
    body {
      font-family: sans-serif;
      margin: 20px;
    }
    .image-container {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }
    .image-container label {
      display: block;
      margin-bottom: 5px;
      cursor: pointer;
    }
    .image-container input[type="checkbox"] {
      display: none;
    }
    .image-container img {
      width: 100px;
      height: 100px;
      border: 2px solid #ccc;
    }
    .image-container input[type="checkbox"]:checked + img {
      border-color: green;
    }
  </style>
</head>
<body>
  <h1>Select Images</h1>
  <div class="image-container">
    <label for="image1">
      <input type="checkbox" id="image1" name="images">
      <img src="https://picsum.photos/id/237/100/100" alt="Image 1">
    </label>
    <label for="image2">
      <input type="checkbox" id="image2" name="images">
      <img src="https://picsum.photos/id/847/100/100" alt="Image 2">
    </label>
    <label for="image3">
      <input type="checkbox" id="image3" name="images">
      <img src="https://picsum.photos/id/1036/100/100" alt="Image 3">
    </label>
  </div>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Image Checkboxes</title>
	<style>
	body {
	font-family: sans-serif;
	margin: 20px;
	}
	.image-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	}
	.image-container label {
	display: block;
	margin-bottom: 5px;
	cursor: pointer;
	}
	.image-container input[type="checkbox"] {
	display: none;
	}
	.image-container img {
	width: 100px;
	height: 100px;
	border: 2px solid #ccc;
	}
	.image-container input[type="checkbox"]:checked + img {
	border-color: green;
	}
	</style>
	</head>
	<body>
	<h1>Select Images</h1>
	<div class="image-container">
	<label for="image1">
	<input type="checkbox" id="image1" name="images">
	<img src="https://picsum.photos/id/237/100/100" alt="Image 1">
	</label>
	<label for="image2">
	<input type="checkbox" id="image2" name="images">
	<img src="https://picsum.photos/id/847/100/100" alt="Image 2">
	</label>
	<label for="image3">
	<input type="checkbox" id="image3" name="images">
	<img src="https://picsum.photos/id/1036/100/100" alt="Image 3">
	</label>
	</div>
	</body>
	</html>