Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Articles by Aman Gupta
66 articles
How to create div that contains the multiple fixed-size images
Creating a div container with multiple fixed-size images is a common requirement in web development for galleries, portfolios, and product catalogs. This approach ensures visual consistency by giving all images uniform dimensions regardless of their original sizes. Syntax Following is the basic HTML structure for a div containing multiple images − Following is the CSS syntax to create fixed-size images − .image-container img { width: fixed-width; height: fixed-height; object-fit: ...
Read MoreWhat does * { mean in HTML?
The asterisk symbol (*) in HTML is actually a CSS universal selector that targets every element in an HTML document. When used in CSS as *{}, it applies styles to all HTML elements on the page, making it a powerful tool for setting global styles or resetting default browser styles. Syntax Following is the syntax for the universal selector in CSS − * { property: value; /* CSS properties go here */ } The asterisk * selects all elements in the HTML document, and any CSS properties defined ...
Read MoreHow to Create a Form with Custom Buttons in HTML
Buttons are interactive HTML elements that trigger specific actions when clicked. In HTML forms, the element by default has type="submit", which submits the form data to the server. Custom buttons enhance user experience by providing styled, functional controls with personalized appearance and behavior. HTML forms support different HTTP methods − GET appends form data to the URL (visible and less secure), while POST sends data in the request body (hidden and more secure). For sensitive information like user credentials, always use the POST method. Syntax Following is the basic syntax for creating an HTML form − ...
Read MoreHow to create a group of related options in a drop-down list using HTML
The tag in HTML allows you to create logical groups of related options within a dropdown list. This improves user experience by organizing options into categories, making it easier for users to find and select the desired option from long lists. Syntax Following is the syntax for the tag − Option 1 Option 2 The label attribute specifies the category name that appears as a heading for the grouped options. ...
Read MoreHow to create the LESS file and how to compile it
LESS (Leaner Style Sheets) is a dynamic CSS preprocessor that extends CSS with additional features like variables, mixins, nested rules, and functions. When compiled, a .less file generates standard CSS output that browsers can understand. LESS helps developers write more maintainable and organized stylesheets by providing programming features that CSS lacks. Just like Java source files (.java) compile to bytecode files (.class), LESS files (.less) compile to CSS files (.css). Installation and Setup Before creating LESS files, you need to install the LESS compiler. The most common method is using Node Package Manager (npm) − ...
Read MoreHow to create list with roman number indexing in HTML
Roman numerals in HTML lists provide an elegant way to display information in a classical numbering format. The (ordered list) element with the type attribute allows you to create lists using Roman numerals instead of regular numbers. Syntax Following is the syntax for creating Roman numeral lists in HTML − First item Second item Third item The type attribute accepts the following values for Roman numerals − type="I" − Creates uppercase Roman numerals (I, II, III, IV, V...) type="i" − ...
Read MoreHow to create mixin for placeholder in SASS
A mixin in SASS is a reusable block of CSS declarations that can be included throughout your stylesheet. Creating a mixin for placeholder styling helps avoid repetitive code when styling form input placeholders across different browsers. Placeholder styling requires vendor-specific pseudo-selectors to ensure cross-browser compatibility. Using a SASS mixin centralizes this logic and makes it easily reusable with customizable parameters. Syntax Following is the syntax to create a mixin in SASS − @mixin mixin-name($parameter1, $parameter2) { // CSS properties here property: $parameter1; } To use the mixin, ...
Read MoreHow to Convert a HTML Table into Excel Spreadsheet using jQuery?
Converting an HTML table to an Excel spreadsheet can be accomplished using the table2excel jQuery plugin. This lightweight plugin provides a simple solution for exporting table data to Excel format with minimal setup. The plugin works by targeting HTML elements and converting their content into downloadable Excel files. Syntax Following is the basic syntax for the table2excel plugin − $(selector).table2excel({ filename: "filename", fileext: ".xls" }); Where − selector − Any HTML table element, class, or ID that identifies the table to export. filename − The ...
Read MoreHow to count the number of notifications on an icon?
A notification icon is a common UI feature in modern web applications that displays the count of pending notifications. This feature can be implemented using HTML, CSS, JavaScript, and Bootstrap to create an interactive notification system with a badge counter. Required CDN Links To build this notification counter, we need to include the following CDN links in our HTML document − Font Awesome CDN Bootstrap CDN HTML Structure The notification icon consists of a button with a bell icon and a badge counter. The notifications ...
Read MoreHow to Create Image Overlay Icon using HTML and CSS
An image overlay is a visual effect where content appears on top of an image when a user hovers over it. This technique combines HTML structure with CSS positioning and transitions to create interactive visual elements commonly used in galleries, profiles, and portfolio websites. Basic Overlay Structure Creating an image overlay requires a container element with the base image and overlay content positioned absolutely within it. The overlay is initially hidden and becomes visible on hover using CSS transitions. HTML Structure ...
Read More