Lightboxで画像が表示されません。

PHP初心者です。ゆくゆくはPHP、MSQLを利用して都道府県クイズを作りたと思っています。
今は土台部分をHTMLで作り、上級ボタンを押下すると日本地図があるページへ画面が遷移し
ます。そこで遷移先の日本地図を拡大できるようにLightboxを使用しました。
しかし、日本地図をクリックしても遷移先の画面が影がかかって小さな四角い白い画面が
現れ半円がくるくる回るだけで日本地図が現れません。

解決方法をどうぞ、お教え下さい。宜しくお願い致します。

発生している問題・エラーメッセージ

HTML
1◆   13行: 要素aはこの位置には置けません。
2◆   13行: 未定義の属性です。(data-lightbox)
3◆   13行: 未定義の属性です。(data-title)
4【 文法チェック結果： ◆エラー 3, ◇情報 0 】
5
6
7### 該当のソースコード
81<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 5.1 Transitional//EN">
92<html>
103<head>
114<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet">
125<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
136<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/js/lightbox.min.js" type="text/javascript"></script>
147<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet">
158<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
169<title>都道府県クイズ★上級</title>
1710</head>
1811<body>
1912	<h1>４７都道府県名物クイズ　上級コース</h1>
2013	<a href="jp.jpg" data-lightbox="abc" data-title="日本地図拡大">
2114  　　　 <img src="jpn.jpg" alt="日本地図">
2215   　　　</a>
2316 <script src="js/lightbox.js"></script>
2417</body>
2518</html>
26
27
28### 試したこと
29
30Lightboxを説明しているサイトを巡り、ファイルをダウンロードして作業フォルダに入れても
31症状が変わらず困っております。
32
33### 補足情報（FW/ツールのバージョンなど）
34
35ここにより詳細な情報を記載してください。
36HTML4.01