Web Development Articles

Page 38 of 801

How to create a dropdown navigation bar with CSS?

AmitDiwan
AmitDiwan
Updated on 03-Jul-2024 16K+ Views

Dropdown navigation is a nav bar that contain dropdown option. You will see a lot of websites where 3rd or 4th item of the navigation has the dropdown feature. When there are multiple options to render on nav bar item on the same category thats where you will need to develop a dropdown navigation bar. Suppose you are providing multiple types of services then you can not render all of them openly on the nav bar, you will put all of them in a dropdown. It is similar to hoverable dropdown menu. Steps to Create a Dorpdown Navbar ...

Read More

How to change the color of an image to black and white using CSS?

Shabaz Alam
Shabaz Alam
Updated on 03-Jul-2024 16K+ Views

To change the color of an image to black and white using CSS, is a simple process that can be done using various approaches. In this article, we will learn and understand two different methods for changing an image to black and white using CSS. We are having an image in this article, our task is to change the color of image to black and white using CSS Approaches to Change Color of Image to Black and white Here is a list of approaches to change the color of an image to black and white using CSS with step wise ...

Read More

How to add a Login Form to an Image using HTML and CSS?

Yaswanth Varma
Yaswanth Varma
Updated on 02-Jul-2024 2K+ Views

The login form on an image can be found on many websites. An organization that organizes a special event might have a website with a picture of the event and a login form, or a restaurant might have a website with pictures of the restaurant. In such case we use image to make a login or signup. Compared to a standard login or registration form, this layout makes the website more appealing. In order to create a login form on a picture, we only need HTML and CSS. Before we dive into the article let’s have a quick view ...

Read More

How To Create A Text Inside A Box Using HTML And CSS

Yaswanth Varma
Yaswanth Varma
Updated on 02-Jul-2024 26K+ Views

To create a text inside a box using HTML and CSS, we will be understanding most commonly used approaches in this article. We are having a element, inside that element we will have element. We need to to place some charecter of the p element inside a box, or create a border surrounded those charecters. Approaches to Create a Text Inside a Box Using span element with CSS Using CSS flexbox Creating a Text inside a Box Using span Element To create a text inside a box using ...

Read More

How to apply multiple CSS properties using jQuery?

Alex Onsman
Alex Onsman
Updated on 01-Jul-2024 17K+ Views

Apply multiple CSS properties using jQuery CSS( {key1:val1, key2:val2....}) method. We can apply as many properties as we like in a single call. Syntax In the below mentioned way we can use the CSS. Here you can pass key as property and val as its value of that property. selector.css( {key1:val1, key2:val2....keyN:valN}) Define Multiple CSS Attributes in jQuery As we mentioned earlier that we will be using jQuery css() method to apply multpile CSS properties on any element. First we will use '$(selector)' to select the element where we wants to apply ...

Read More

How to remove CSS property using JavaScript?

Shubham Vora
Shubham Vora
Updated on 28-Jun-2024 22K+ Views

To remove CSS property using JavaScript, it can be helpful in various aspects like removing unnecessary style property, increase the performance, can be easily maintained and and debugging becomes easier. In this article we are having a div element and in some approaches p element on which some CSS properties have veen applied. Our task is to remove applied CSS property using JavaScript. Approaches to Remove CSS property using JavaScript There are various ways to remove CSS property using JavaScript, here is a list of approaches with step wise explaination and complete example codes. Using ...

Read More

How to create a hoverable dropdown menu with CSS?

AmitDiwan
AmitDiwan
Updated on 27-Jun-2024 6K+ Views

Hoverable dropdown is dropdown that opens when we hover on that dropdown. This kind of dropdown are mostly used on header menu. If the user hover over on any element of the header menu then it will automatically open and render the content of that dropdown. Steps to Create Hoverable Dropdown Before proceeding to create a hoverable dropdown we will create a dropdown structure first using HTML. Step 1 - Add HTML: Here we will create dropdown structure for that we can use , or any element. here in this article we will use the button element. ...

Read More

JavaScript Group a JSON Object by Two Properties and Count

Nikitasha Shrivastava
Nikitasha Shrivastava
Updated on 27-Jun-2024 3K+ Views

The problem stated that we have to add two properties of the JSON object and count its occurrences. For example we have name and age properties in JSON then group them in a single property and count their occurrences. What is JSON? JSON (Javascript Object Notation) is lightweight data to transfer between devices. It is human readable and writable data. JSON is in the form of key-value pairs. Keys are strings to define values. In JSON each entry is separated by a semicolon. For example - {“name” : “Peter”}, in this example name is a key and Peter ...

Read More

How to define two column layout using flexbox?

Aayush Mohan Sinha
Aayush Mohan Sinha
Updated on 27-Jun-2024 5K+ Views

To create a two column layout using flexbox can be so easy if you have the knowledge of CSS display property. Flexbox is a layout model in CSS that provides an efficient and flexible way to arrange and distribute space between items within a container. It arranges elements in a single dimension, either horizontally or vertically, within a container. To know more about the CSS Flexbox Layout visit the attached link. Imagine we have parent div and inside that div we have two child div all we have to do is place those child div side by horizontally. Ways to ...

Read More

How to set div width to fit content using CSS?

Shabaz Alam
Shabaz Alam
Updated on 26-Jun-2024 52K+ Views

To set div width to fit content using CSS is an important task due to various reasons like making a responsive design and optimal use of space. In this article, we have used a p element to write content inside div element. We are having div as parent element and content written in p is our child element. Our task is to set div width to fit content written in p element. Approaches to Set div width to Fit Content using CSS There are multiple ways to set div width to fit content using CSS, here is a list ...

Read More
Showing 371–380 of 8,006 articles
« Prev 1 36 37 38 39 40 801 Next »
Advertisements