You need a dynamic dependent select box. We will explain how to create a dynamic dependent select box in PHP, jquery and ajax. index.php <?php include_once 'dbconfig.php'; ?> <html> <head> <title>Dynamic Dependent Select Box using Ajax</title> <script type="text/javascript" src="jquery-1.4.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#loding1").hide(); $("#loding2").hide(); $(".country").change(function() { $("#loding1").show(); var id=$(this).val(); var dataString = 'id='+ id; […]
In this article, you will learn How to Create Input Style with CSS. Input with Icon or Image:- <html> <head> <title>Input with Icon or Image</title> <style> input[type=text] { width: 100%; box-sizing: border-box; border: 2px solid #ccc; border-radius: 4px; font-size: 16px; background-color: white; background-image: url('search_icon.png'); background-position: 10px 10px; background-repeat: no-repeat; padding: 12px 20px 12px 40px; } </style> </head> <body> […]
In this article, you will learn How to Create Email Verification Script in PHP. user_registration table CREATE TABLE IF NOT EXISTS `user_registration` ( `id` int(11) NOT NULL, `name` varchar(255) NOT NULL, `email` varchar(255) NOT NULL, `password` varchar(255) NOT NULL, `activationcode` varchar(255) NOT NULL, `status` int(11) NOT NULL, `postingdate` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ) ENGINE=InnoDB AUTO_INCREMENT=4 […]
Cascading Stylesheet is used to describe the style of HTML document. CSS Example:- h1{ text-align:center; color:#fff; } p { font-size: 20px; font-family: arial; } Types of CSS Internal CSS External CSS Inline CSS Internal CSS Internal CSS is use between the section of <head>.. </head> with the <style> </style> tag. Example:- <html> <head> <title>Internal CSS</title> <style> p{ color:#fff; font-size:20px; […]
In this article, you will learn how to use CSS Property of List tag in HTML. Example:- list.html <html> <head> <title>List Property</title> <limk rel="stylesheet" href="style.css">> </head> <body> <ul> <li>Home</li> <li>Anout</li> <li>Gallery</li> <li>Blog</li> <li>Contact Us</li> </ul> </body> </html> style.css li{ display:inline; margin-left: 10px; font-weight:bold; } Output:- Home About Gallery Blog Contact You can read on Facebook
In this article, you will learn How to use CSS for Table in HTML. Example:- table.html <html> <head> <title>Table</title> <link rel="stylesheet" href="style.css"/> </head> <body> <table> <tr> <th>Roll No.</th><th>Name</th><th>Class</th><th>Gender</th><th>City</th> </tr> <tr> <td>124</td><td>Amandeep Singh</td><td>BCA</td><td>Male</td><td>Amritsar</td> </tr> <tr> <td>136</td><td>Nisha Sharma</td><td>MCA</td><td>Female</td><td>Patiala</td> </tr> </table> </body> </html> style.css table, th, td { border: 1px solid black; } table { width: 100%; } th […]
We will guide you on How to Create a Navigation Bar using CSS. nav.html <html> <head> <title>Navigation Bar</title> <link rel="stylesheet" href="style.css"/> </head> <body> <ul> <li><a class="active" href="#home">Home</a></li> <li><a href="#news">News</a></li> <li><a href="#contact">Contact</a></li> <li><a href="#about">About</a></li> </ul> </body> </html> style.css ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; position: fixed; top: 0; width: 100%; […]
In this article, you will learn How to use hover in Cascading Stylesheet. Example:- hover.html <html> <head> <link href="style.css" rel="stylesheet" type="text/css"> <title> Menus</title> </head> <body> <ul class="menu-1"> <li><a href="#">UG Colleges</a></li> <li><a href="#">PG Colleges</a></li> <li><a href="#">Diploma Colleges</a></li> </ul> </body> </html> style.css li{ display:inline; margin-left:20px; } li a:hover{ color:#fff; background-color:green; text-decoration:none; padding:10px }
In this article, you will learn How to Create Dropdown with hover. dropdown.html <html> <head> <title>Dropdown List using Hover</title> <link rel="stylesheet" href="style.css"/> </head> <body> <div class="dropdown"> <span>Mouse over me</span> <div class="dropdown-content"> <p>Hello World!</p> </div> </div> </body> </html> style.css .dropdown { position: relative; display: inline-block; } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: […]
In this article, you learn How to Create Image Gallery in HTML. Follow the Example. Example:- gallery.html <html> <head> <title>Image Gallery</title> <link rel="stylesheet" href="style.css"/> </head> <body> <div class="gallery"> <a target="_blank" href="img_one.jpg"> <img src="img_one.jpg" alt="img_one" width="500" height="300"> </a> <div class="descr">Image One</div> </div> <div class="gallery"> <a target="_blank" href="img_two.jpg"> <img src="img_two.jpg" alt="img_two" width="500" height="300"> </a> <div class="descr">Image Two</div> […]