Posts

Showing posts from January, 2023

Responsive Navbar using Bootstrap or Responsive Menu

 <!doctype html> <html lang="en"> <head>     <!-- Required meta tags -->     <meta charset="utf-8">     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">     <!-- Bootstrap CSS -->     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css"         integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">     <title>Bootstrap Navbar</title>     <style>         body{             background-image: url(img/1.jpg);             background-size: cover;         }         .navbar{             background-color: rgb(199,58,159);         ...
Post a Comment
Read more

Bootstrap Modal Box or Pop Up (On Click)

 <!doctype html> <html lang="en"> <head>     <!-- Required meta tags -->     <meta charset="utf-8">     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">     <!-- Bootstrap CSS -->     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css"         integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">     <title>ModalBox</title>     <style>         .btn-primary {             background-color: green;         }         label{             font-weight: bold;         }         input{             padding:2px 10px...
Post a Comment
Read more

Custom Scroll Bar Using HTML And CSS

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title >Document</ title >     < style >         body {             background-color : burlywood ;             font-size : 1.5 rem ;         }         ::-webkit-scrollbar-track {             background-color : red ;         }         ::-webkit-scrollbar {             width : 40 px ;         }         ::-webkit-scrollbar-thumb {             background-color : bl...
Post a Comment
Read more

Key Frames Slider

// CSS  * {     margin: 0;     padding: 0;     box-sizing: border-box; } body {     background-color: lightblue;     font-family: sans-serif; } h1 {     text-align: center;     text-transform: uppercase;     margin-top: 20px; } .containter {     height: 100vh;     width: 100vw;     display: flex;     justify-content: center;     /* justify-items: center; */ } .seema_slider {     height: 400px;     width: 1000px;     border: .5px solid gray;     background-image: url('../Images/1.png');     background-size: 100% 100%;     animation: slider 25s linear infinite; } @keyframes slider {     0% {         background-image: url('../Images/1.png');     }     25% {         background-image: url('../Images/2.png');     }   ...
Post a Comment
Read more

Hi Everyone

 Hi Everyone
Post a Comment
Read more