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 AmitDiwan
Page 236 of 840
How to affect other elements when one element is hovered in HTML?
To affect other elements when one element is hovered in HTML, you need to establish a relationship between the elements using CSS pseudo-classes and CSS selectors. The hover effect can target child elements, descendant elements, or adjacent sibling elements using the appropriate CSS combinators. The most common approach uses the :hover pseudo-class combined with descendant selectors to change styles of child elements when the parent is hovered. This technique works because CSS allows you to target elements based on their relationship to the hovered element. Syntax Following is the basic syntax for affecting child elements on hover ...
Read MoreHTML onmousemove Event Attribute
The HTML onmousemove event attribute is triggered when the user moves the mouse pointer over an HTML element. This event fires continuously while the mouse is in motion over the target element, making it useful for tracking cursor movement and creating interactive hover effects. Syntax Following is the syntax for the onmousemove event attribute − Where script is the JavaScript code to execute when the mouse moves over the element. Parameters The onmousemove event attribute accepts the following parameter − script − JavaScript code or function call to execute ...
Read MoreHow do you get the footer to stay at the bottom of a Web page in HTML?
Creating a footer that stays at the bottom of a web page is a common web design requirement. There are different approaches depending on whether you want a sticky footer (always visible at bottom of viewport) or a footer that stays at the page bottom (appears after all content). Using Fixed Position for Sticky Footer The position: fixed property creates a footer that remains visible at the bottom of the browser window, even when scrolling. This approach keeps the footer constantly visible to users. Syntax #footer { position: fixed; ...
Read MoreHTML onmouseout Event Attribute
The HTML onmouseout event attribute is triggered when the mouse pointer moves out of an HTML element. This event is commonly used to reset styles, hide tooltips, or perform cleanup actions when users move their cursor away from an element. Syntax Following is the syntax for the onmouseout event attribute − Content Where script is the JavaScript code to execute when the mouse leaves the element. Parameters script − JavaScript code or function call that executes when the mouse pointer moves out of the element. Example − Circle Color ...
Read MoreCenter one and right/left align other flexbox element in HTML
In web development, we often need to center multiple elements while pushing one specific element to the right or left edge. For example, if we have elements P, Q, R, S, T aligned in the center − P Q R S T We want to keep P, Q, R, S centered while moving T to the right edge − ...
Read MoreHTML DOM Anchor hostname Property
The HTML DOM Anchor hostname property returns or sets the hostname portion of a URL. The hostname is the domain name part of the URL, excluding the protocol, port number, path, and hash fragments. Syntax Following is the syntax to return the hostname property − anchorObj.hostname Following is the syntax to set the hostname property − anchorObj.hostname = hostname Here, hostname is a string representing the domain name of the URL. Return Value The hostname property returns a string containing the hostname of the URL. For example, if ...
Read MoreHTML onmouseover Event Attribute
The HTML onmouseover event attribute is triggered when the mouse pointer moves over an HTML element. This event is commonly used to create interactive effects, show tooltips, highlight elements, or change visual appearance when users hover over content. Syntax Following is the syntax for the onmouseover event attribute − Content Where script is the JavaScript code to execute when the mouse enters the element area. Basic Example Following example demonstrates a simple onmouseover event that changes text color when hovering − HTML onmouseover Event ...
Read MoreMake container shrink-to-fit child elements as they wrap in HTML
Making a container shrink-to-fit its child elements as they wrap is a common CSS layout challenge. This technique ensures that the container only takes up as much width as needed by its content, rather than stretching to fill the available space. We achieve this using CSS Flexbox properties combined with proper container sizing. How It Works The key to making a container shrink-to-fit is using display: inline-flex or display: flex with width: fit-content. The inline-flex display value makes the flex container behave like an inline element, automatically sizing to its content width. When child elements wrap using ...
Read MoreHTML returnValue Event Property
The HTML returnValue event property is a legacy property that was used to control whether an event's default action should be prevented. While it has been deprecated in favor of the preventDefault() method, it is still supported in some browsers for backward compatibility. Syntax Following is the syntax for getting the returnValue property − event.returnValue Following is the syntax for setting the returnValue property − event.returnValue = boolean Parameters The returnValue property accepts a boolean value − true − Allows the event's default action to proceed (default ...
Read MoreHow wide is the default margin?
The default body margin in HTML is 8px on all sides. This margin is applied by the browser's user-agent stylesheet, creating a small space between the page content and the viewport edges. Understanding and controlling this default margin is essential for creating precise web layouts. Default Margin in HTML All modern browsers apply a default margin of 8px to the element. This prevents content from touching the browser window edges, providing better readability. The margin appears as white space around your content. Example − Default 8px Margin Following example shows how the default margin creates ...
Read More