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 Tapas Kumar Ghosh
185 articles
How to display Suggestions for input Field in HTML?
HTML provides several ways to display suggestions for input fields, enhancing user experience through placeholder text, required field validation, and autocomplete dropdowns. These features help users understand what data is expected and provide convenient options for data entry. Syntax Following is the syntax for the required attribute − Following is the syntax for the placeholder attribute − Following is the syntax for the datalist element − Input Field Suggestion Methods ...
Read MoreHow to divide HTML page into four parts using frame?
HTML frames allow you to divide a web page into multiple independent sections, each displaying separate content. The element acts as a container that defines how the browser window is divided into rows and columns, while individual elements specify what content to display in each section. Important Note − HTML frames are deprecated in HTML5 and are not supported by modern browsers. This article is for educational purposes to understand legacy HTML. Modern web development uses CSS Grid, Flexbox, or iframe elements instead. Syntax Following is the basic syntax for creating a frameset − ...
Read MoreHow to disable spell check from input box and text area in HTML forms?
The spellcheck attribute in HTML allows you to control whether browsers should check spelling and grammar in input fields and text areas. By default, most browsers enable spell checking on editable text elements, showing misspelled words with a red underline. You can disable this feature by setting the spellcheck attribute to false. Syntax Following is the syntax for the spellcheck attribute on input elements − Following is the syntax for the spellcheck attribute on textarea elements − Spellcheck Attribute Values The spellcheck attribute accepts the following values ...
Read MoreHow to Search the Parse Tree using BeautifulSoup?
BeautifulSoup is a Python library for parsing HTML and XML documents and searching through the parse tree. The find() and find_all() methods are the most commonly used approaches for locating specific elements within the parsed document structure. BeautifulSoup creates a parse tree from HTML/XML documents, allowing you to search, navigate, and modify the content easily. It provides a simple API that works well for beginners and offers comprehensive documentation for quick learning. Installation Before using BeautifulSoup, install it using pip − pip install beautifulsoup4 Syntax Following are the main methods used for ...
Read MoreHow to Design Wave Images in HTML?
HTML provides powerful tools for creating visually appealing wave designs using the SVG element and CSS animations. Wave images enhance user experience by adding dynamic visual elements to websites, commonly used in headers, footers, landing pages, and decorative sections. This article demonstrates two effective methods to create wave patterns in HTML. Syntax Following is the basic syntax for creating wave images using SVG − The key components are − SVG element − Container for scalable vector graphics viewBox attribute − Defines the coordinate system and viewport ...
Read MoreHow to divide text into two column layout using HTML and CSS?
Creating a two-column text layout is a common web design requirement for displaying content side-by-side. This can be achieved using HTML div elements combined with CSS positioning properties like float or modern layout methods like flexbox. Syntax .column { width: 50%; float: left; } Properties Used The following CSS properties are commonly used for two-column layouts − width − Defines the width of each column (typically 50% or specific pixel values) float − Positions elements side-by-side (left/right) margin − Creates spacing around columns padding ...
Read MoreHow to dynamically create \'@-Keyframe\' CSS animations?
In CSS, the @keyframes rule specifies a sequence of styles that an element should go through during the animation. The @keyframes rule allows you to create dynamic animations by defining specific points (keyframes) in an animation timeline where certain CSS properties should have particular values. These styles are then applied to elements via the animation property, which sets the animation's duration, timing function, and other properties to create smooth transitions between keyframe states. Syntax @keyframes animation-name { 0% { /* CSS properties */ } 50% { /* CSS ...
Read MoreHow to design Meet the Team Page using HTML and CSS
In this article, we will learn how to design a "Meet the Team" page using HTML and CSS. The team page plays a very important role while creating websites for any business or organization. People from different countries connect with the business through team members. The team page is a great way to introduce the team that shows the members of the organization or company. Key Properties Used The following CSS properties are used in this example − text-align − Aligns text content to center, left, or right. background-color − Sets the background color of elements. ...
Read MoreHow to display paragraph elements as inline using CSS?
The CSS display property can be used to change how paragraph elements are displayed. By default, paragraphs are block-level elements that take up the full width and create line breaks. Setting display: inline makes them flow within the same line as surrounding text. Syntax p { display: inline; } Default vs Inline Display Block-level elements like paragraphs normally: Take up the full width of their container Create line breaks before and after Stack vertically Inline elements: Flow within a line of text Only take up as ...
Read MoreHow to disable resizable property of textarea using CSS?
The CSS resize property controls whether an element can be resized by the user. By default, textareas are resizable, allowing users to drag their corners to change dimensions. Setting resize: none disables this functionality completely. Syntax textarea { resize: none; } Possible Values ValueDescription noneDisables resizing completely bothAllows resizing in both directions (default) horizontalAllows resizing only horizontally verticalAllows resizing only vertically Example: Disabling Textarea Resize The following example creates two textareas − one resizable (default) and one non−resizable − ...
Read More