Cascading Style Sheets (CSS) is a powerful component of web development which enables the developers to determine the visual appearance of their websites. In CSS, classes are used as selectors which enables us to apply several specific styles to an element. You can also use multiple classes for a particular element. However, when you apply multiple classes to an element, it is necessary to know how to specify the order of these classes in which they will be rendered to avoid discrepancies and unexpected results. In this article, we will discuss different methods to specify the order of classes ... Read More

The Paradoxical effect is a visual effect which is used to create optical illusion of any object, element or text that appears to move in a contradictory way. This effect can be used to add interesting and unique element to your web page. This can be easily created using HTML and CSS. In this article, we will discuss about the techniques and properties which is required for creating Paradoxical effect using CSS. We will start creating simple paradoxes using combination of two CSS properties simultaneously, and then dive into more advanced techniques which enables us to create complex paradoxical ... Read More

One of the most powerful features of CSS is the ability to apply multiple transforms to an element, which can be used to create stunning visual effects and animations. In this article, we will discuss how to apply multiple transform properties to an element using CSS, and we will provide examples of how this technique can be used to enhance the user experience on a website. We will cover the basic syntax of the transform property, as well as more advanced techniques such as nesting transforms and using multiple transforms to create complex animations. Whether you are a beginner or ... Read More

Flexbox is a powerful layout system in CSS which enables the web developers to create responsive and flexible web designs. With its ability to easily align and organize elements within a container, it has become a popular choice for building modern websites. However, aligning flexbox columns left and right can be a challenge for many developers, especially when dealing with dynamic content or varying column widths. In this article, we will discuss about the various techniques for aligning flexbox columns to the left and right using CSS, including the use of flexbox properties, margin auto, and the align-content property. By ... Read More

In web development, CSS (Cascading Style Sheets) enables the developers to determine the visual appearance and layout of a website. However, since different web browsers have varying levels of support mechanism for CSS, it can result in inconsistency while rendering the web pages by the compiler. To overcome this compatibility issue, developers often opt for using CSS hacks to ensure that their web pages are displayed consistently across different browsers and devices. One such hack is the star-preceded property (also known as star property hack), which is used to target specific versions of Internet Explorer (IE) that have limited support ... Read More

Tabs are created to implement multipage views in apps. Tabs are often placed on the top or at the bottom of the screen. Some libraries permit making tabs in mobile apps. Tabs can use icons instead of text type of labels. In this article, the React native and javascript code is shown with two different examples where in the first example, createMaterialBottomTabNavigator from '@react-navigation/material-bottom-tabs' is used to make tabs and then rendering these as labels. In the other example, the icons from Ionicons are used to make tabs and then render these on the screen of the device. Algorithm-1 Step ... Read More

Audio is a common component of mobile apps. Audio can be used in apps in many ways. Audio can be selected from the mobile, it can be used from any online link, or can be included in the project itself as local audio. Expo-av can be used in all these cases for integrating sound into mobile apps. In this article, the React native and javascript code is shown with three different examples where in the first example, an audio file is browsed from the device. In the second example, the audio is taken from an online link and mixed with ... Read More

Sometimes, the task is to show a small bounded area with some text, picture, or colors and to retrieve more information from it later or to perform some actions on selecting that item. For this Card from react-native-paper can be used. More than one Card can also be used on a Screen, integrating it as a list item and it can be made clickable. In this article, the React native and javascript code is shown with two different examples where first a single card with an Image is used in an app, and in the second example multiple cards are ... Read More

Tabs are created to implement multipage views in apps. Tabs are often placed on the top or at the bottom of the screen. Some libraries permit making tabs in mobile apps. Tabs can also be made using simple components like buttons. In this article, the React native and javascript code is shown with two different examples where in the first example, the buttons are used to make tabs. In the other example, the createMaterialTopTabNavigator from '@react-navigation/material-top-tabs' is used to make tabs and then render these on the screen of the device. Algorithm 1 Step 1 − Import Text, View, StyleSheet, ... Read More

Text to Speech is an important area where the written language text is converted into speech form. For using Text to Speech conversion, functionality from expo-speech can be used. In this article, the React native and javascript code is shown with two different examples, where in the first example while showing the text-to-speech conversion, the pitch and speed change are shown along with the original conversion. In the second example, the pause, resume, and stop methods are demonstrated and the user can also enter the text at the time of conversion. Algorithm-1 Step 1 − Import Text, View, StyleSheet, and ... Read More