Advertisement
Vprento

KO ZA KOLOK TOA FINKI

Dec 25th, 2017
110
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 4.91 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <html>
  4.  
  5. <head>
  6.  
  7.     <title>Vezvba za kolokvium</title>
  8.  
  9.     <style type="text/css">
  10.  
  11.     body {
  12.  
  13.         background-color: lightgreen;
  14.  
  15.         font-family: Arial;
  16.  
  17.         font-size: 16px;
  18.  
  19.     }
  20.  
  21.     .top {
  22.  
  23.         width: 1000px;
  24.  
  25.         margin-right: auto;
  26.  
  27.         margin-left: auto;
  28.  
  29.     }
  30.  
  31.     .right1 {
  32.  
  33.  
  34.  
  35.     }
  36.  
  37.  
  38.  
  39.     a {
  40.  
  41.         color: white;
  42.  
  43.         text-decoration: none;
  44.  
  45.     }
  46.  
  47.     .sidebar {
  48.  
  49.         width: 180px;
  50.  
  51.         border: 3px dotted black;
  52.  
  53.         float: left;
  54.  
  55.         background-color: darkgreen;
  56.  
  57.  
  58.  
  59.     }
  60.  
  61.     .main {
  62.  
  63.         margin-right: 260px;
  64.  
  65.         margin-left: 260px;
  66.  
  67.     }
  68.  
  69.     .right2 {
  70.  
  71.         background-color: white;
  72.  
  73.         width: 795px;
  74.  
  75.         float: right;
  76.  
  77.         padding-bottom: 39px;
  78.  
  79.  
  80.  
  81.     }
  82.  
  83.     .nav {
  84.  
  85.         background-color: darkgreen;
  86.  
  87.         margin-bottom: 10px;
  88.  
  89.         padding-top: 6px;
  90.  
  91.         padding-bottom: 6px;
  92.  
  93.  
  94.  
  95.     }
  96.  
  97.  
  98.  
  99.     </style>
  100.  
  101. </head>
  102.  
  103. <body>
  104.  
  105.     <div class="top">
  106.  
  107.         <div class="left" style="display: inline-block;"><img src="logo.png" style=" width: 65px;height: 50px"><h2 style="display: inline-block;color: white;">Finki</h2><h2 style="display: inline-block;">Company</h2></div>
  108.  
  109.         <div class="right1" style="display: inline-block; float: right;"><h2 style="padding-top: 10px;">The software company</h2></div>
  110.  
  111.     </div>
  112.  
  113.     <div class="nav">
  114.  
  115.         <ul style="list-style-type: none; margin-left: 260px; margin-bottom: 0px;margin-top: 0px;margin-right: 0px; padding: 0;">
  116.  
  117.             <li style="display: inline;"><a href="#">Home</a></li>
  118.  
  119.             <li style="display: inline;"><a href="#">Home</a></li>
  120.  
  121.             <li style="display: inline;"><a href="#">Home</a></li>
  122.  
  123.             <li style="display: inline;"><a href="#">Home</a></li>
  124.  
  125.             <li style="display: inline;"><a href="#">Home</a></li>
  126.  
  127.             <li style="display: inline;"><a href="#">Home</a></li>
  128.  
  129.         </ul>
  130.  
  131.  
  132.  
  133.     </div>
  134.  
  135.    
  136.  
  137.     <div class="main">
  138.  
  139.         <div class="sidebar" style="display: inline-block;"> <h3 style="text-align: center;color: white">Links to something</h3>
  140.  
  141.  
  142.  
  143.  
  144.  
  145.     <ul style="list-style-type: none;margin: 0; padding: 0; width: 180px;">
  146.  
  147.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  148.  
  149.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  150.  
  151.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  152.  
  153.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  154.  
  155.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  156.  
  157.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  158.  
  159.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  160.  
  161.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  162.  
  163.         <li><a href="#" style="display: block; color: white; background-color: lightblue; padding: 8px 16px; text-decoration: none; margin-bottom: 5px;">Home</a></li>
  164.  
  165.    
  166.  
  167.     </ul>
  168.  
  169. </div>
  170.  
  171.         <div class="right2" style="display: inline-block;"">
  172.  
  173.         <h3 style="text-align: center;"> About us</h3>
  174.  
  175.         <p style="text-align: justify; padding-right: 5px; padding-left: 5px;">In years gone by, text to speech software was rather expensive, but these days there are excellent options free of charge and we're here to help you find the very best tools that will make converting written documents to audio files as easy as possible. </p>
  176.  
  177.  
  178.  
  179.         <p style="text-align: justify; padding-right: 5px; padding-left: 5px;">Text to speech software can be enormously helpful for anyone who's visually impaired, or has a condition like dyslexia that makes reading on screens tricky. It can also help overcome language barriers for people who read a language but don't speak it, or are in the process of learning.</p>
  180.  
  181.  
  182.  
  183.         <p style="text-align: justify; padding-right: 5px; padding-left: 5px;">Text to speech software is also ideal if you want to listen to a document while doing something else, if you find it easier to retain information you've heard, or if you want to sense-check something you've written. </p>
  184.  
  185.     <h3 align="center">Apply for a job</h3>
  186.  
  187.     <form style="text-align: center;">
  188.  
  189.         <label>Name:</label><input type="text"><br>
  190.  
  191.         <label>Email:</label><input type="text"><br>
  192.  
  193.         <label>Position:</label><select><option>Software engineer</option></select><br>
  194.  
  195.         <input type="button" class="btn" value="Apply">
  196.  
  197.     </form>
  198.  
  199. </div>
  200.  
  201. </div>
  202.  
  203.  
  204.  
  205. </body>
  206.  
  207. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement