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
Front End Technology Articles
Page 46 of 652
HTML DOM Form submit() method
The HTML DOM Form submit() method is used to programmatically submit form data to the server address specified by the action attribute. This method acts like clicking a submit button, triggering form submission without user interaction. Syntax Following is the syntax for the Form submit() method − formObject.submit() Parameters The submit() method does not take any parameters. Return Value The method does not return any value. It simply submits the form data to the server. Example − Basic Form Submission Following example demonstrates how to use the submit() method ...
Read MoreHow to set the maximum value of progress bar using HTML?
The progress bar on websites represents the completion percentage of tasks like file downloads, form submissions, or data processing. In HTML, the element creates a visual progress indicator that shows how much work is completed versus the total amount. The element uses two key attributes to control its behavior. The max attribute sets the maximum value representing 100% completion, while the value attribute indicates the current progress level. Syntax Following is the syntax for the HTML progress element − The progress bar calculates the completion percentage as: (value / max) ...
Read MoreHow to sort HTML elements by data-attribute?
In HTML, you can sort elements by their data attributes using JavaScript. Data attributes allow you to store custom information directly in HTML elements, which can then be used for sorting, filtering, or other dynamic operations. This technique is particularly useful when you need to reorder elements based on custom criteria without modifying the original HTML structure. Common use cases include sorting product lists by price, organizing content by date, or arranging elements by priority levels stored in data attributes. Syntax Following is the basic syntax for adding data attributes to HTML elements − Content ...
Read MoreHow to use font awesome icon as a cursor?
Web browsers display an arrow cursor by default, but CSS allows us to customize cursor appearance using the cursor property with values like pointer, grab, or zoom-in. However, we can go beyond these predefined options by using Font Awesome icons as custom cursors through HTML5 Canvas and data URLs. How It Works To use a Font Awesome icon as a cursor, we need to − Include the Font Awesome CDN in our HTML document Create an HTML5 element dynamically using JavaScript Draw the Font Awesome icon onto the canvas using its Unicode character Convert the ...
Read MoreHow to use SVG with :before or :after pseudo element?
The :before and :after pseudo-elements in CSS allow you to insert content before or after an element without adding extra HTML markup. These pseudo-elements are particularly useful for decorative content and can be used to display SVG images alongside your existing content. There are two primary methods to use SVG with :before and :after pseudo-elements − Using the content property − Directly embed SVG URLs or inline SVG code in the content property. Using the background-image property − Set SVG as a background image for the pseudo-element. Syntax Following is the basic syntax for ...
Read MoreHow to use text-overflow in a table cell?
The text-overflow property in CSS controls how overflowing text is displayed when it exceeds its container's boundaries. This property is particularly useful in table cells where space is limited and you need to present text in a clean, organized manner. The text-overflow property must be used alongside two essential properties: white-space: nowrap and overflow: hidden. Without these companion properties, text-overflow has no effect. Syntax Following is the syntax for using the text-overflow property in table cells − td { max-width: value; white-space: nowrap; overflow: hidden; ...
Read MoreHow to create a file upload button with HTML?
To create a file upload button with HTML, we use the element with type="file". This creates a button that allows users to select and upload files from their device to a web server. Syntax Following is the basic syntax for creating a file upload button − The type="file" attribute transforms a regular input element into a file selection button. The name attribute identifies the file data when submitted to the server. Basic File Upload Button The simplest file upload implementation requires just the input element within a form. The browser ...
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 can I vertically center a div element for all browsers using CSS?
To vertically center a div element for all browsers using CSS, there are several reliable methods. The most modern and widely supported approach is using Flexbox, which provides complete control over alignment and works consistently across all modern browsers. Vertical centering has historically been challenging in CSS, but modern layout methods like Flexbox and CSS Grid have made it straightforward. We'll explore multiple techniques to ensure compatibility across different browser versions and use cases. Method 1: Using Flexbox (Recommended) Flexbox is the most reliable method for vertical centering. It works in all modern browsers and provides excellent ...
Read MoreHow to make an svg scale with its parent container
SVG, or Scalable Vector Graphics, is a markup language built on XML used to create vector graphics. Unlike raster images (JPG, PNG), SVG images are resolution-independent and can be scaled to any size without losing quality. This makes them ideal for responsive web design where graphics must adapt to various screen sizes and containers. What is SVG? SVG is an XML-based markup language for creating vector graphics. Vector graphics are composed of shapes, lines, and curves defined by mathematical equations rather than pixels. This mathematical foundation allows SVG images to be infinitely scalable while maintaining crisp edges and ...
Read More