Advertisement
Tavxela

Untitled

Apr 22nd, 2021
894
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 2.25 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <link rel="stylesheet" href="styles/main.css">
  8.     <meta name="author" content="Luka Tavkhelidze">
  9.     <link rel="shortcut icon" href="media/images/favicon.png" type="image/x-icon">
  10.     <title>Luka Tavkhelidze</title>
  11. </head>
  12. <body>
  13.     <header> <!-- <div id="header">  -->
  14.         <nav class="navbar">
  15.             <ul>
  16.                 <li><a href="#">Home</a></li>
  17.                 <li><a href="#">About</a></li>
  18.                 <li><a href="#">Blog</a></li>
  19.                 <li><a href="#">Contact</a></li>
  20.             </ul>
  21.         </nav>
  22.     </header>
  23.     <main> <!-- <div id="main">  -->
  24.         <div id="bck-img">
  25.             <p>
  26.                 I've background image
  27.             </p>
  28.         </div>
  29.  
  30.         <h2 id="img-eye-heading">This is an image</h2>
  31.         <img src="./media/images/image-map.jpg" alt="eye-image" id="img-eye" usemap="#task9">
  32.  
  33.         <map name="task9">
  34.             <area
  35.            target="_blank" alt="eye-pupil"
  36.            title="eye-pupil" href="https://www.google.com/search?q=eye%20pupil"
  37.            coords="301,313,98" shape="circle"
  38.            >
  39.         </map>
  40.  
  41.         <section class="blog">
  42.             <header>
  43.                 <h2>I'm heading 2</h2>
  44.             </header>
  45.             <article>
  46.                 <p>
  47.                     Lorem ipsum dolor sit amet
  48.                     consectetur adipisicing elit.
  49.                     Quia nostrum sint, eveniet maxime ratione
  50.                     alias sit. Accusamus ex delectus a sequi,
  51.                     iusto incidunt perspiciatis doloribus facilis,
  52.                     dolores eius amet cupiditate.
  53.                     Lorem ipsum dolor sit amet consectetur,
  54.                     adipisicing elit. Soluta molestiae quidem dolor rem,
  55.                     assumenda ut ad nulla amet aliquam, vitae maxime
  56.                     alias necessitatibus odio quod delectus officia natus magnam fuga?
  57.                 </p>
  58.             </article>
  59.         </section>
  60.     </main>
  61.     <footer> <!-- <div id="footer">  -->
  62.  
  63.     </footer>
  64. </body>
  65. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement