cl1p.net - The internet clipboard
cl1p.net Discord
Login/Sign Up
cl1p.net/code
cl1p.net/code
cl1p.net Discord
Login/Sign Up
This cl1p will be deleted in in 15 hours.
Copy
--------------------------------1-bootstap.html------------------------------------ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap Demo</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <nav class="navbar navbar-dark bg-primary"> <div class="container"> <a class="navbar-brand" href="#">My Website</a> <ul class="nav"> <li class="nav-item"><a class="nav-link text-white" href="#">Home</a></li> <li class="nav-item"><a class="nav-link text-white" href="#">About</a></li> <li class="nav-item"><a class="nav-link text-white" href="#">Contact</a></li> </ul> </div> </nav> <div class="container mt-3"> <nav> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="#">Home</a></li> <li class="breadcrumb-item active">Bootstrap</li> </ol> </nav> <div id="carousel" class="carousel slide mb-4" data-bs-ride="carousel"> <div class="carousel-inner"> <div class="carousel-item active"> <img src="https://picsum.photos/1200/300" class="d-block w-100"> </div> <div class="carousel-item"> <img src="https://picsum.photos/1200/301" class="d-block w-100"> </div> </div> </div> <h3>12 Column Grid</h3> <div class="row text-center"> <div class="col-md-4 bg-primary text-white p-3">4</div> <div class="col-md-4 bg-success text-white p-3">4</div> <div class="col-md-4 bg-danger text-white p-3">4</div> </div> <h3 class="mt-4">Buttons</h3> <button class="btn btn-primary">Primary</button> <button class="btn btn-success">Success</button> <button class="btn btn-danger">Danger</button> <h3 class="mt-4">Form</h3> <form> <input class="form-control mb-2" placeholder="Name"> <input class="form-control mb-2" type="email" placeholder="Email"> <button class="btn btn-primary">Submit</button> </form> <h3 class="mt-4">Table</h3> <table class="table table-bordered"> <tr class="table-dark"> <th>ID</th><th>Name</th><th>Marks</th> </tr> <tr><td>1</td><td>Rahul</td><td>85</td></tr> <tr><td>2</td><td>Anita</td><td>90</td></tr> </table> <button class="btn btn-warning mb-5" data-bs-toggle="modal" data-bs-target="#modal"> Open Modal </button> <div class="modal fade" id="modal"> <div class="modal-dialog"> <div class="modal-content p-3"> <h4>Bootstrap Modal</h4> <p>This is a dialogue box.</p> <button class="btn btn-secondary" data-bs-dismiss="modal">Close</button> </div> </div> </div> </div> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> </body> </html> ---------------------------------2-book.xml------------------------------------------ <?xml version="1.0" encoding="UTF-8"?> <book> <title> The Reddy </title> <author>Radhika Reddy</author> <isbn>98765432101</isbn> <publisher>Pradhyumna Reddy</publisher> <edition>4th edition</edition> <price>399</price> </book> --------------------------------------3-In folder(BookXML)---------------------------------------------------------------------------------------------- ----------------------------1)book.xml------------------------------------ <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE book SYSTEM "book.dtd"> <book> <title>The Reddy</title> <author>Radhika Reddy</author> <isbn>98765432101</isbn> <publisher>Pradhyumna Reddy</publisher> <edition>4th edition</edition> <price>399</price> </book> ---------------------------------2)book.xsd-------------------------------- <?xml version="1.0" encoding="UTF-8"?> <xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema"> <xs:element name="book"> <xs:complexType> <xs:sequence> <xs:element name="title" type="xs:string"/> <xs:element name="author" type="xs:string"/> <xs:element name="isbn" type="xs:string"/> <xs:element name="publisher" type="xs:string"/> <xs:element name="edition" type="xs:string"/> <xs:element name="price" type="xs:float"/> </xs:sequence> </xs:complexType> </xs:element> </xs:schema> -----------------------------------3)book.dtd---------------------------- <!ELEMENT book (title, author, isbn, publisher, edition, price)> <!ELEMENT title (#PCDATA)> <!ELEMENT author (#PCDATA)> <!ELEMENT isbn (#PCDATA)> <!ELEMENT publisher (#PCDATA)> <!ELEMENT edition (#PCDATA)> <!ELEMENT price (#PCDATA)> -------------------------------------4)bookXSD.xml----------------------- <?xml version="1.0" encoding="UTF-8"?> <book xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="book.xsd"> <title>My life My rules</title> <author>Pradhyumna Reddy</author> <isbn>9780061122415</isbn> <publisher>Radhika Reddy</publisher> <edition>1st Edition</edition> <price>50000</price> </book> ----------------------------------task-2------------------------------------------------------------------------------------- ---------------------------------grid.html----------------------------- <!DOCTYPE html> <html> <head> <title>Student Report</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body class="bg-light"> <h1 class="text-center text-primary my-4">Student Report</h1> <div class="container"> <div class="row g-4"> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Student Details</div> </div> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Grades</div> </div> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Attendance</div> </div> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Performance</div> </div> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Subjects</div> </div> <div class="col-12 col-md-6 col-lg-4"> <div class="bg-info-subtle text-center p-5 fs-4">Events</div> </div> </div> </div> </body> </html> -----------------------------flext2.html--------------------------------- <!DOCTYPE html> <html> <head> <title>College Canteen Menu</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body class="bg-light"> <h1 class="text-center text-success my-4">College Canteen Menu</h1> <div class="container"> <div class="d-flex flex-wrap justify-content-center gap-4"> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Snacks </div> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Drinks </div> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Meals </div> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Fast Food </div> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Desserts </div> <div class="bg-success-subtle text-center p-5 rounded fs-4 flex-grow-1"> Special Items </div> </div> </div> </body> </html> ------------------------------------transitiont2.html---------------------------------- <!DOCTYPE html> <html> <head> <title>Triangle Transition</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"> <style> .triangle { width: 0; height: 0; border-left: 70px solid transparent; border-right: 70px solid transparent; border-bottom: 120px solid #264653; transition: 0.8s; } .triangle:hover { transform: rotate(60deg); border-bottom-color: #e76f51; } </style> </head> <body class="bg-light text-center"> <h1 class="text-success mt-5">Triangle Transition</h1> <p>Move the mouse over the triangle</p> <div class="triangle mx-auto my-5"></div> </body> </html> -----------------------------------animationt2.html---------------------- <!DOCTYPE html> <html> <head> <title>Simple Animation</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"> <style> .box { width: 100px; height: 100px; background: #457b9d; border-radius: 15%; animation: move 3s infinite; } @keyframes move { 0% { transform: rotate(0deg); background: #457b9d; } 50% { transform: rotate(180deg); background: #e76f51; } 100% { transform: rotate(360deg); background: #2a9d8f; } } </style> </head> <body class="bg-light text-center"> <h1 class="text-primary mt-5">Square Animation</h1> <div class="box mx-auto my-5"></div> </body> </html>