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 on Trending Technologies
Technical articles with clear explanations and examples
Define the style for the body of the modal with Bootstrap
Use the .modal class to define the style for the body of the modal.You can try to run the following code to implement the .modal class −Example Bootstrap Example Website Information Info × Warning If JavaScript isn't enabled in your web browser, then you may not be able to see this information correcty. Close
Read MoreBootstrap 4 .rounded-circle class
To create a rounded circle with Bootstrap, use the rounded-circle class.Add the rounded-circle class in the Above, we also have a test class, which is a CSS class to style the circle −.test { width: 270px; height: 320px; background-color: yellow; }You can try to run the following code to implement the rounded-circle class in Bootstrap 4 −Example Bootstrap Example .test { width: 350px; height: 320px; background-color: yellow; } Circle We have a circle below:
Read MoreBootstrap 4 Button .btn-outline-light class
Use the btn-outline-light class in Bootsrap 4 to set light grey outlined button.To include it on the web page, set it as a class in the element as shown in the following code snippet −Let us see an example to implement the btn-outline-light class −Example Bootstrap Example Demo Button Below is a light grayed outline button: Sample
Read MoreBootstrap 4 .card-text class
Use the card-text class in Bootstrap to set text in a card. Add this class in your web page by including it as any other class in an element, for example, tag in the below given code snippet − Demo text in a card The text in the card is added inside the class using the card-text class − Demo Title Demo text in a card You can try to run the following code to implement the card-text class −Example Bootstrap Example Demo Demo Title Demo text in a card
Read MoreAlign gathered items from the start in Bootstrap 4
To align gathered items from the start, use the .align-content-start class in Bootstrap 4.Set the items as shown below − Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 You can try to run the following code to implement the align-content-start in Bootstrap 4 −Example Bootstrap Example Align Flex Items Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 Work 7 Work 8 Work 9 Work 10 Work 11 Work 12 Work 13 Work 14
Read MoreAssigning values to static final variables in java
In java, a non-static final variable can be assigned a value at two places.At the time of declaration.In constructor.Examplepublic class Tester { final int A; //Scenario 1: assignment at time of declaration final int B = 2; public Tester() { //Scenario 2: assignment in constructor A = 1; } public void display() { System.out.println(A + ", " + B); } public static void main(String[] args) { Tester tester = new Tester(); ...
Read MoreSegment button dropdowns in Bootstrap input groups
To segment button dropdowns in input groups, use the same general style as the dropdown button, but add a primary action along with the dropdown as can be seen in the following example:Example Bootstrap Example Subject Toggle Dropdown Maths Science Course Toggle Dropdown BCA MCA
Read MoreHow to use Bootstrap Tab Plugins
By combining a few data attributes, you can easily create a tabbed interface. With this plug-in you can transition through panes of local content in tabs or pills, even via drop down menus.You can try to run the following code to implement tab plugins −Example Bootstrap Example Home ...
Read MoreBootstrap success Contextual class
The Bootstrap success contextual class indicates a successful or positive action.You can try to run the following code to implement the .success class −Example Bootstrap Table Subject Marks Student Maths 90 Amit Science 80 Aman English 85 Rahul
Read MoreBootstrap 4 class for a single flex item to take up the available space
In Bootstrap 4, if you want a flex item to take up the available space, then use the flex-grow-|1 class.If you want the first flex item to take up the space, then the following is the code − One Two Three Above you can see, I have used the flex-grow-1 class in the first div class − One The following is an example to implement the flex-grow-0|1 class −Example Bootstrap Example
Read More