Found 10483 Articles for Web Development

Javascript Program for Range Queries for Frequencies of array elements

Prabhdeep Singh
Updated on 12-Apr-2023 12:15:19

192 Views

We are given an array that will contain integers and another array will be given that will contain the queries and each query represents the range that we are given by the leftmost and the rightmost index in the array and an element. For that range or the subarray, we have to find the frequency of the given element present in that range. The frequency of the elements means that we have to tell for each integer present in that range how many times it occurs. For example − If, the given array is: [5, 2, 5, 3, 1, 5, ... Read More

How to set blur distance in CSS?

Shabaz Alam
Updated on 12-Apr-2023 09:08:08

379 Views

CSS (Cascading Style Sheets) is a powerful tool for designing the visual effects of a website. The blur effect is one of the many features in CSS, which is used to blur any element using the blur property. To create a soft, dreamy effect or to draw attention to a specific element on a page, we can use the blur effect. Syntax css element { filter : blur (amount) } The Concept of Blur Distance in CSS Before discussing the practical aspect of setting blur distance, it is important to understand the concept of blur distance. ... Read More

How to set background-image for the body element using CSS?

Shabaz Alam
Updated on 12-Apr-2023 09:06:52

378 Views

CSS (Cascading Style Sheets) is a powerful tool for designing the visual appearance of a website. The background-image property is one of the many features in CSS, which is used to set the background image using the background-image property. In web development, the background image is an important part of the overall design of a website. The default background of the body element in HTML is white, but with a few lines of CSS code, the background of a webpage can be changed to any image. Setting background-image in CSS Setting a background image is a great way to enhance ... Read More

How to set alternate table row color using CSS?

Shabaz Alam
Updated on 20-Aug-2024 14:51:49

11K+ Views

To set alternate table row color using CSS, is also known as zebra striping. It is helpful in improving the readability of table as it is easier to distinguish between rows. In this article, we will be understanding four different approaches to set alternate table row color using CSS. We are having a 5*2 table, our task is to set alternate table row color using CSS. Approaches to Set Alternate Table Row Color Here is a list of approaches to set alternate table row color using CSS which we will be discussing in this article with stepwise explaination and complete ... Read More

How to set all the font properties in one declaration using CSS?

Shabaz Alam
Updated on 12-Apr-2023 09:04:41

2K+ Views

CSS or Cascading Style Sheets, is a powerful tool that provides a range of properties for aligning and positioning fonts on a web page. The font declaration property is one of the many properties available in CSS. In CSS, all font properties can be set in one declaration using the shorthand property. This property allows specifying the font style, variant, weight, size, line height, family, text decoration, and text transform all in one line of code. Setting Font Properties in CSS CSS provides a variety of font properties for styling text, which are used to style text on a web ... Read More

How to create a rainbow using HTML5

Aman Gupta
Updated on 11-Apr-2023 16:06:09

2K+ Views

Overview The task is to create a beautiful rainbow using the HTML5 version. The rainbow consists of the seven colors, these seven colors are Violet, Indigo, Blue, Green, Yellow, Orange and Red. These colors are arranged in the bottom-up approach. So to achieve this task we will use the Scalable Vector Graphics tag which helps us to create the graphics shape inside a HTML page. Inside the svg element we have several elements by which we can draw the shape. These tags are: rect, circle, ellipse, line, polyline, polygon and path. Syntax The syntax used to create the ... Read More

How to create radio button similar to the toggle button using Bootstrap

Aman Gupta
Updated on 11-Apr-2023 16:05:14

1K+ Views

Overview We can create a radio button same as the toggle button which can be used in our web application in the part where we have to choose the options or regarding changing actions. In creating the radio button we can use the bootstrap predefined classes which will help us to build a radio button. A toggle button is a button which is the same as a normal button toggleable button and a radio button is a button with a checkbox like shape in front of the option. Content Delivery Network (CDN) Links These CDN links are used to ... Read More

How to set align-self property to its default value in CSS?

Shabaz Alam
Updated on 12-Apr-2023 09:03:02

341 Views

CSS or Cascading Style Sheets is a powerful tool that provides a range of properties for aligning and positioning elements on a web page. The align-self property is one of the many properties available in CSS, which is used to adjust the alignment of individual flex items within a flex container. By default, align-self is set to auto, which means that the element will inherit the alignment of its parent container. However, this behavior can be changed for individual flex items by setting the align-self property. scc selector{ align-self: auto; } The align-self Property in CSS Before we discuss ... Read More

How to create progress bar using the HTML and CSS

Aman Gupta
Updated on 11-Apr-2023 16:03:32

2K+ Views

Overview The progress bar is the main component for any web application. The progress tells the completion of a certain project or task. In this module we will build the progress bar using the HTML and will style it through the CSS. We will also provide the progress animation to our progress bar. In this task we will use the @keyframes to make the progress bar animated. Using the animation styling property such as animation duration, name, timing, etc. Algorithm Step 1 − Create a HTML boilerplate in your text editor. Step 2 − Create the parent div container ... Read More

How to create progress bar in different colors in Bootstrap

Aman Gupta
Updated on 11-Apr-2023 16:01:18

919 Views

Overview Bootstrap provides beautiful ways to build the components to our website. The bootstrap comes up with certain classes by using these classes in our tags. A whole component can be built very nicely without adding an external style sheet, but if we want to make some changes to the component then we can add a stylesheet to it. To create a simple progress bar with the help of bootstrap, we will use certain bootstrap classes these are − progress progress-bar If we want to create a progress bar with the animated striped, bootstrap has its own ... Read More

Advertisements