API tools faq
paste
Advertisement
ERENARD63

Eduford

ERENARD63
Dec 8th, 2021
1,278
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.85 KB | None | 0 0
raw download clone embed print report
  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.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!