API tools faq
paste
kaboom09

Exercise 2

kaboom09
Apr 4th, 2019
71
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 4.24 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.     <title>Exercise @2</title>
  8. <style>
  9.     body{
  10.         background-image: url(17.jpg);
  11.         background-repeat: no-repeat;
  12.         background-position: bottom right;
  13.         background-attachment: fixed;
  14.          
  15.     }
  16.         *{
  17.           box-sizing: border-box;
  18.         }
  19.        
  20.         header {
  21.         height: 263px;
  22.         background-image: (ncu_logo.png);
  23.         padding: 10px;
  24.         text-align: center;
  25.         font-size: 30px;
  26.         color: rgb(250, 121, 0);
  27.         background: rgba(200, 250, 250, 0.5);
  28.         }
  29.        
  30.         /*Define Left Coloumn  */
  31.         nav {
  32.           float: left;
  33.           width: 25%;
  34.           height: 400px;
  35.           padding: 20px;
  36.           background: rgba(300,250,300,0.6);
  37.         }
  38.         /*Define Right Coloumn*/
  39.         article {
  40.           float: right;
  41.           padding: 20px;
  42.           width: 75%;
  43.           background: rgba(243, 255, 205,0.4);
  44.           height: 400px;
  45.         }
  46.  
  47.         /*Define the footer */
  48.         footer {
  49.           float: inherit;
  50.           background: rgba(19, 3, 3, 0.561);
  51.           padding: 20px;
  52.           text-align: center;
  53.           color: white;
  54.         }
  55.        
  56.         /* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
  57.         @media (max-width: 900px) {
  58.           nav, article {
  59.             width: 100%;
  60.             height: auto;
  61.           }
  62.         }
  63.         </style>
  64.         </head>
  65.         <body>
  66.  
  67.         <header>
  68.             <img src="ncu_logo.png" alt="Logo of NCU" style="float: right;">
  69.           <h2>The NorthCap University</h2><br><br>
  70.           <a style="color: peru">Sem 5 Elective course Selection</a>
  71.         </header>
  72.        
  73.        
  74.           <nav>
  75.               <h2 style="text-align: center">
  76.                   Log In
  77.               </h2>
  78.                 <form action="submit.html">
  79.                         Username:<br>
  80.                         <input type="text" name="Username" >
  81.                         <br>
  82.                         Password:<br>
  83.                         <input type="password" name="Password">
  84.                         <br><br>
  85.                         <input type="submit" value="Submit">
  86.                         </form>
  87.           </nav>
  88.          
  89.           <article>
  90.             <h1>Select Your Electives</h1>
  91.            
  92.                            
  93.             <h4>
  94.                     Choices for Program Elective
  95.             </h4>
  96.             <form>
  97.                                 <input type="radio" name="Programelective" value="Python" checked> Python<br>
  98.                                 <input type="radio" name="Programelective" value="DataScience"> DataScience<br>
  99.                                 <input type="radio" name="Programelective" value="Javascript"> Javascript<br>
  100.                                 <input type="radio" name="Programelective" value="R Programing" checked> R Programing<br><br>
  101.             </form>
  102.                               <h4>
  103.                                    Choices for Open Elective
  104.                               </h4>
  105.  
  106.  
  107.             <form>
  108.                                 <input type="radio" name="Openelective" value="Marketing" checked> Marketing<br>
  109.                                 <input type="radio" name="Openelective" value="Environmental Studies"> Environmental Studies<br>
  110.                                 <input type="radio" name="Openelective" value="Human Science"> Human Science<br>
  111.                                 <input type="radio" name="Openelective" value="Economics" checked> Economics<br><br>
  112.             </form>
  113.            
  114.         </article>
  115.        
  116.         <footer>
  117.             <hr>
  118.             <p>For any Queries Contact</p>
  119.               CSE Department Email- supportcse@ncuindia.edu
  120.           <p>
  121.               Copyright @NCU<br>
  122.             All Rights Reserved by NCU
  123.           </p>
  124.         </footer>
  125.         <p>
  126.           Are Bas Or kitna Niche jana h
  127.         </p>
  128.        
  129.         </body>
  130.         </html>
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!