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 Lakshmi Srinivas
Page 4 of 24
Change the color of the bottom border with CSS
The border-bottom-color CSS property changes the color of an element's bottom border. This property only affects the color, not the width or style of the border. Syntax border-bottom-color: color; Parameters The property accepts standard CSS color values including hex codes, RGB values, HSL values, and named colors. Example p.demo { border: 4px solid black; ...
Read MoreSet border width with CSS
The border-width property allows you to set the width of element borders. The value of this property could be either a length in px, pt or cm or it should be set to thin, medium or thick. Syntax border-width: value; /* Individual sides */ border-top-width: value; border-right-width: value; border-bottom-width: value; border-left-width: value; /* Shorthand for all sides */ border-width: top right bottom left; Values The border-width property accepts the following values: Length units: px, pt, em, rem, cm, mm Keywords: thin, medium, thick Global values: initial, inherit, unset ...
Read MoreSet a border between two lines with CSS
Use the border-style property with double value to set a border with two lines. The double border style creates two solid lines with a gap between them, making it useful for highlighting content or creating visual separation. Syntax border-style: double; border-width: thickness; Example .no-border { border-width: 4px; border-style: ...
Read MoreHow to adopt a flex div's width to content in HTML?
By default, flex containers with display: flex take up the full width of their parent. To make a flex container shrink to fit its content, use display: inline-flex. The Problem with display: flex Regular flex containers expand to fill their parent's width, even when content is smaller: .flex-container { display: flex; padding: 10px; background-color: lightblue; border: 2px solid blue; margin: 10px 0; } ...
Read MoreDoes HTML5 only replace the video aspects of Flash/Silverlight?
HTML5 doesn't only replace video aspects of Flash/Silverlight—it provides comprehensive alternatives for graphics, animations, multimedia, and interactive content through several powerful technologies. What HTML5 Offers Beyond Video While HTML5's and elements replace Flash's multimedia capabilities, the element provides a complete drawing and animation platform using JavaScript. HTML5 Canvas Element The element creates a drawable region where you can render graphics, animations, and interactive content dynamically: Canvas Animation Example Here's a simple animation that demonstrates Canvas capabilities: const canvas = document.getElementById('animCanvas'); const ...
Read MoreCSS padding-top property
The padding-top CSS property specifies the top padding of an element. It creates space between the element's content and its top border. This property accepts values in pixels, percentages, em units, or other CSS length units. Syntax padding-top: value; Values The padding-top property accepts the following values: Length values: px, em, rem, cm, etc. Percentage: Relative to the width of the containing block inherit: Inherits from parent element initial: Sets to default value (0) Example with Length Values ...
Read MoreAndroid 4.0.1 breaks WebView HTML 5 local storage?
Android 4.0.1 introduced stricter security policies that can break HTML5 local storage in WebView components. This issue primarily affects apps targeting older Android versions when loading local HTML content. The Problem For Android versions less than 4.4, loading data into a WebView with a file scheme as a directory won't enable local storage properly: // This approach fails on Android 4.0.1 browser.loadDataWithBaseUrl("file:///android_asset/", html, "text/html", "UTF-8", null); Solution 1: Add Filename to Base URL Adding a specific filename to the base URL resolves the local storage issue on older Android versions: // ...
Read MorejQuery Mobile: Sending data from one page to the another
jQuery Mobile provides several methods to pass data between pages. The most common approaches include URL parameters, localStorage, and sessionStorage. Method 1: Using URL Parameters Pass data through the URL query string when navigating between pages. HTML Link with Parameters Go to New Page JavaScript to Extract Parameters $(document).on("pageinit", "#new", function(event) { // Get URL parameters var url = $(this).data("url"); if (url) { ...
Read MoreUsage of margin-bottom property with CSS
The margin-bottom CSS property specifies the bottom margin of an element, creating space below it. It accepts values in pixels, percentages, ems, or the keyword auto. Syntax margin-bottom: length | percentage | auto | initial | inherit; Parameters length - Fixed value in px, em, rem, etc. percentage - Relative to parent element's width auto - Browser calculates the margin automatically initial - Sets to default value (0) inherit - Inherits from parent element Example: Basic margin-bottom Usage ...
Read MoreDrop target listens to which events in HTML5?
To accept a drop in HTML5, a drop target must listen to at least three essential events that handle the drag-and-drop sequence. Required Events for Drop Targets The dragenter event, which is used to determine whether the drop target is to accept the drop. If the drop is to be accepted, then this event has to be canceled. The dragover event, which is used to determine what feedback is to be shown to the user. If the event is canceled, then the feedback (typically the cursor) is updated based on the dropEffect attribute's value. Finally, the drop ...
Read More