ERENARD63

Eduford

Dec 8th, 2021
908
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2. <head>
  3. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  4. <title>University Website Design - Easy Tutorials</title>
  5. <link rel="stylesheet" href="style.css">
  6. <link href="https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,600,700&display=swap" rel="stylesheet">
  7. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  8. </head>
  9. <body>
  10.     <section class="header">
  11.        
  12.         <nav>
  13.             <a href="index.html"><img src="images/logo.png"></a>
  14.             <div class="nav-links" id="navLinks">  
  15.                 <i class="fa fa-close" onclick="hideMenu()"></i>
  16.                 <ul>
  17.                     <li><a href="index.html">HOME</a></li>
  18.                     <li><a href="about.html">ABOUT</a></li>
  19.                     <li><a href="course.html">COURSE</a></li>
  20.                     <li><a href="blog.html">BLOG</a></li>
  21.                     <li><a href="contact.html">CONTACT</a></li>
  22.                 </ul>
  23.             </div>
  24.             <i class="fa fa-bars" onclick="showMenu()"></i>
  25.         </nav>
  26.        
  27.         <div class="text-box">
  28.             <h1>World's Biggest University</h1>
  29.             <p>Making website is now one of the easiest thing in the world. You just need to learn HTML, CSS,<br>Javascript and you are good to go.</p>
  30.             <a href="contact.html" class="hero-btn">Visit Us to Know More</a>
  31.         </div>
  32.     </section>
  33.    
  34. <!---------- course ----------->
  35.    
  36.     <section class="course">
  37.         <h1>Courses We Offer</h1>
  38.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  39.         <div class="row">
  40.             <div class="course-col">
  41.                 <h3>Intermediate</h3>
  42.                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus Donec sit.</p>
  43.             </div>
  44.             <div class="course-col">
  45.                 <h3>Degree</h3>
  46.                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus Donec sit.</p>
  47.             </div>
  48.             <div class="course-col">
  49.                 <h3>Post Graduation</h3>
  50.                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus Donec sit.</p>
  51.             </div>
  52.         </div>
  53.     </section>
  54.    
  55. <!---------- campus ---------->
  56.    
  57.     <section class="campus">
  58.         <h1>Our Global campus</h1>
  59.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  60.             <div class="row">
  61.                 <div class="campus-col">
  62.                     <img src="images/london.png">
  63.                     <div class="layer">
  64.                         <h3>LONDON</h3>
  65.                     </div>
  66.                 </div>
  67.                 <div class="campus-col">
  68.                     <img src="images/newyork.png">
  69.                     <div class="layer">
  70.                         <h3>NEW YORK</h3>
  71.                     </div>
  72.                 </div>
  73.                 <div class="campus-col">
  74.                     <img src="images/washington.png">
  75.                     <div class="layer">
  76.                         <h3>WASHINGTON</h3>
  77.                     </div>
  78.                 </div>
  79.                
  80.             </div>
  81.     </section>
  82.    
  83. <!---------- Facilities ---------->
  84.    
  85.     <section class="facility">
  86.         <h1>Our Facilities</h1>
  87.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  88.             <div class="row">
  89.                 <div class="facility-col">
  90.                     <img src="images/library.png">
  91.                     <h3>World Class Library</h3>
  92.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla.</p>
  93.                 </div>
  94.                 <div class="facility-col">
  95.                     <img src="images/basketball.png">
  96.                     <h3>Largest Play Ground</h3>
  97.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla.</p>
  98.                 </div>
  99.                 <div class="facility-col">
  100.                     <img src="images/cafeteria.png">
  101.                     <h3>Tasty and Healthy Food</h3>
  102.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla.</p>
  103.                 </div>
  104.             </div>
  105.     </section>
  106.    
  107.    
  108. <!---------- testimonials ---------->
  109.    
  110.     <section class="testimonials">
  111.         <h1>What Our Student Says</h1>
  112.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  113.             <div class="row">
  114.                 <div class="testimonial-col">
  115.                     <img src="images/user1.jpg">
  116.                     <div>
  117.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus.</p>
  118.                         <h3>Christine Berkley</h3>
  119.                         <i class="fa fa-star"></i>
  120.                         <i class="fa fa-star"></i>
  121.                         <i class="fa fa-star"></i>
  122.                         <i class="fa fa-star"></i>
  123.                         <i class="fa fa-star-o"></i>
  124.                     </div>
  125.                 </div>
  126.                 <div class="testimonial-col">
  127.                     <img src="images/user2.jpg">
  128.                     <div>
  129.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus.</p>
  130.                         <h3>David Byer</h3>
  131.                         <i class="fa fa-star"></i>
  132.                         <i class="fa fa-star"></i>
  133.                         <i class="fa fa-star"></i>
  134.                         <i class="fa fa-star"></i>
  135.                         <i class="fa fa-star-half-o"></i>
  136.                     </div>
  137.                 </div>
  138.                
  139.             </div>
  140.     </section>
  141.    
  142. <!------ Call To Action ------>
  143.  
  144. <section class="cta">
  145.    
  146.        <h1>Enroll For Our Various Online Courses<br>Anywhere From The World</h1>
  147.         <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1" class="hero-btn">CONTACT US</a>
  148.    
  149. </section>    
  150.  
  151. <!-------- footer ---------->
  152.  
  153. <section class="footer">
  154.         <h4>About Us</h4>
  155.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque aliquet turpis nulla, eleifend faucibus est<br>sollicitudin ut. Maecenas ut venenatis ex, et dapibus purus.</p>
  156.         <div class="icons">
  157.             <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1"><i class="fa fa-facebook"></i></a>
  158.             <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1"><i class="fa fa-twitter"></i></a>
  159.             <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1"><i class="fa fa-instagram"></i></a>
  160.             <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1"><i class="fa fa-linkedin"></i></a>
  161.            
  162.         </div>
  163.         <a href="https://www.youtube.com/c/EasyTutorialsVideo?sub_confirmation=1" class="footer-link"><p>made with <i class="fa fa-heart-o"></i> by Easy Tutorials</p></a>
  164. </section>    
  165.  
  166.  
  167. <!----JavaScript for toggle menu---->
  168. <script>
  169.     var navLinks = document.getElementById("navLinks");
  170.  
  171.     function showMenu() {
  172.         navLinks.style.right = "0";
  173.     }
  174.  
  175.     function hideMenu() {
  176.         navLinks.style.right = "-200px";
  177.     }
  178. </script>
  179.    
  180. </body>
  181. </html>
  182.  
  183.  
  184.  
  185.  
  186.  
  187.  
  188.  
  189.  
RAW Paste Data