API tools faq
paste
vonko1988

CSS_less_homework_task1.html

vonko1988
Mar 1st, 2014
214
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 6.96 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <title>CSS Styling </title>
  5.     <link type="text/css" rel="stylesheet" href="task1.css" />
  6. </head>
  7. <body>
  8.     <header>
  9.         <div id="header-container">
  10.             <div id="logo-container">
  11.                 <h1>
  12.                     <a href="#">
  13.                         <img src="images/Sample%20Logo.png" />
  14.                     </a>
  15.                 </h1>
  16.             </div>
  17.             <div id="reg-form-container">
  18.                 <form>
  19.                     <div>
  20.                         <label for="tb-username">Username: </label>
  21.                         <input type="text" id="tb-username" name="tb-username"/><br />
  22.                         <label for="tb-password">Password: </label>
  23.                         <input type="password" id="tb-password" name="tb-password"/>
  24.                     </div>
  25.                     <button id="btn-register">Register</button>
  26.                 </form>
  27.             </div>
  28.         </div>
  29.         <nav>
  30.             <ul id="main-nav-list"  class="nav-list">
  31.                 <li>
  32.                     <a href="#">Home</a>
  33.                 </li>
  34.                 <li>
  35.                     <a href="#">Presentations</a>
  36.                     <ul class="nav-list sub-nav-list">
  37.                         <li class="selected">
  38.                             <a href="#">Intro CSS Styling Course</a>
  39.                         </li>
  40.                         <li>
  41.                             <a href="#">CSS Overview</a>
  42.                         </li>
  43.                         <li>
  44.                             <a href="#">CSS Presentation</a>
  45.                         </li>
  46.                         <li>
  47.                             <a href="#">CSS Display</a>
  48.                         </li>
  49.                         <li>
  50.                             <a href="#">CSS Layout</a>
  51.                         </li>
  52.                         <li>
  53.                             <a href="#">SASS</a>
  54.                         </li>
  55.                         <li>
  56.                             <a href="#">LESS</a>
  57.                         </li>
  58.                     </ul>
  59.                 </li>
  60.                 <li>
  61.                     <a href="#">Videos</a>
  62.                 </li>
  63.                 <li>
  64.                     <a href="#">Trainers</a>
  65.                 </li>
  66.                 <li>
  67.                     <a href="#">Contacts</a>
  68.                 </li>
  69.             </ul>
  70.         </nav>
  71.     </header>
  72.     <section>
  73.         <article>
  74.             <header>
  75.                 <h1>Lorem ipsum dolor sit amet</h1>
  76.             </header>
  77.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin egestas, dui sed cursus placerat, felis metus sollicitudin nunc, nec venenatis augue tellus vitae nisl. Quisque ut venenatis est. Vestibulum non dolor nec sapien imperdiet semper nec quis massa. Phasellus ultrices vestibulum rutrum. Vestibulum auctor felis eget ipsum semper vulputate. Sed congue, metus sit amet tempus pretium, nunc sapien pellentesque elit, ut porttitor eros orci nec arcu. Nunc lobortis risus eget eros viverra dapibus.</p>
  78.             <footer>
  79.                 <p>
  80.                     published by
  81.                     <a href="#">Doncho Minkov</a> on
  82.                     <time>08-jan-2013</time> at
  83.                     <time>14:51</time>
  84.                 </p>
  85.             </footer>
  86.         </article>
  87.         <article>
  88.             <header>
  89.                 <h1>Vestibulum ante ipsum primis</h1>
  90.             </header>
  91.             <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus eget tincidunt velit. Cras sed lectus mauris. Vivamus massa lacus, laoreet nec sollicitudin eu, pharetra sed elit. Aenean quis enim dui, sed mollis sapien. Duis vel eros sapien, sed blandit magna. Praesent a dolor leo, a gravida lectus. Fusce non aliquam nibh. Aenean nisl dui, faucibus consequat fermentum at, rutrum congue urna. Ut fringilla tempor risus dictum aliquam. Donec congue sapien et massa sagittis eget pharetra risus sollicitudin. Vestibulum urna nunc, feugiat sed tincidunt et, fringilla non nisi. Mauris neque tellus, lobortis a vehicula eget, volutpat id erat. Donec rutrum consectetur malesuada. Curabitur mollis orci at sapien tristique ac mattis nulla sollicitudin.</p>
  92.             <footer>
  93.                 <p>
  94.                     published by
  95.                     <a href="#">Doncho Minkov</a> on
  96.                     <time>08-jan-2013</time> at
  97.                     <time>14:51</time>
  98.                 </p>
  99.             </footer>
  100.         </article>
  101.         <article>
  102.             <header>
  103.                 <h1>Nullam ullamcorper dolor sed enim venenatis aliquet</h1>
  104.             </header>
  105.             <p>Nullam ullamcorper dolor sed enim venenatis aliquet. Aenean magna magna, consectetur vel gravida at, gravida ac eros. Donec tincidunt iaculis diam, sit amet aliquam libero fermentum non. Donec at lectus at eros interdum lobortis nec sed massa. Sed nec hendrerit magna. Nunc nec vestibulum lorem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque rutrum neque orci, quis dapibus justo. Sed id turpis a purus luctus dictum eget vitae tortor. Maecenas eu nunc in nisi interdum eleifend non sed ante. Integer sit amet rutrum magna. Maecenas sed blandit quam.    </p>
  106.             <footer>
  107.                 <p>
  108.                     published by
  109.                     <a href="#">Doncho Minkov</a> on
  110.                     <time>08-jan-2013</time> at
  111.                     <time>14:51</time>
  112.                 </p>
  113.             </footer>
  114.         </article>
  115.     </section>
  116.  
  117.     <aside>
  118.         <ul>
  119.             <li>
  120.                 <h2>Widget</h2>
  121.                 <p>
  122.                     Duis vel eros sapien, sed blandit magna.
  123.                     <a href="#">Praesent</a> a dolor leo, a gravida <strong>lectus</strong>. Fusce non aliquam nibh. Aenean nisl dui, faucibus consequat fermentum at, rutrum congue urna.
  124.                 </p>
  125.             </li>
  126.             <li>
  127.                 <h2>Widget</h2>
  128.                 <ul>
  129.                     <li>
  130.                         Widget Item
  131.                     </li>
  132.                     <li>
  133.                         Widget Item
  134.                     </li>
  135.                     <li>
  136.                         Widget Item
  137.                     </li>
  138.                     <li>
  139.                         Widget Item
  140.                     </li>
  141.                 </ul>
  142.             </li>
  143.             <li>
  144.                 <h2>Widget</h2>
  145.                 <p>
  146.                     Duis vel eros sapien, sed blandit magna.
  147.                     <a href="#">Praesent</a> a dolor leo, a gravida <strong>lectus</strong>. Fusce non aliquam nibh. <em>Aenean nisl dui</em>, faucibus consequat fermentum at, rutrum congue urna.
  148.                 </p>
  149.             </li>
  150.         </ul>
  151.     </aside>
  152.     <footer>
  153.         <p>
  154.             Telerik Software Academy
  155.         </p>
  156.     </footer>
  157. </body>
  158. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!