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
Articles by Lakshmi Srinivas
Page 4 of 24
Add the default styles for the dropdown menu container in Bootstrap
Use the .dropdown-menu class in Bootstrap to add the default styles for the dropdown menu containerExample Bootstrap Example Mobile Phones The following are the mobile phone brands available in India: Companies Apple Samsung Oppo Nokia
Read MoreAdd plain text next to a form label within a form with Bootstrap
To add plain text to a form label within a form, use the .form-control-static in Bootstrap.You can try to run the following code to implement a .form-control-static class in BootstrapExample Bootstrap Example Email: amit@demo.com
Read MoreSet active state for Bootstrap Buttons
To set the active state for Bootstrap Buttons, use the .active class.The button will appear pressed as in the following codeExample Bootstrap Example The following are some buttons: Default Button Active Button
Read MoreHide content depending on screen size with Bootstrap
Use the .hidden-* class in Bootstrap to hide content depending on screen size with BootstrapExample Bootstrap Example This is visible. This is hidden. Hidden on small screen Hidden on medium screen
Read MoreImage Thumbnail with Bootstrap
To add a thumbnail to the image, use the .img-thumbnail Bootstrap class.You can try to run the following code to add a thumbnail to imagesExample Bootstrap Images Styling images with Bootstrap Original Image Thumbnail Image
Read MoreWhat is the difference between super and this, keywords in Java?
The this is a keyword in Java which is used as a reference to the object of the current class. Using it you can − Differentiate the instance variables from local variables if they have same names, within a constructor or a method. Call one type of constructor (parametrized constructor or default) from other in a class. It is known as explicit constructor invocation. Example class Superclass { int age; Superclass(int age) { this.age = age; } public void ...
Read MoreRotate In Animation Effect with CSS
To create a rotate in animation effect with CSS, you can try to run the following code −Example .animated { background-image: url(/css/images/logo.png); background-repeat: no-repeat; background-position: left top; padding-top:95px; margin-bottom:60px; -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } Reload page function myFunction() { location.reload(); }
Read MoreDisplay the flex lines in the center of the container with CSS
Use the align-content property with value center to set the flex lines to the center.You can try to run the following code to implement the center valueExample .mycontainer { display: flex; height: 200px; background-color: red; align-content: center; flex-wrap: wrap; } .mycontainer > div { background-color: yellow; text-align: center; line-height: 60px; font-size: 30px; width: 100px; margin: 5px; } Queue Q1 Q2 Q3 Q4 Q5 Q6 Q7 Q8
Read MorePerform Animation on CSS border-bottom-right-radius property
To implement animation on border-bottom-right-radius property with CSS, you can try to run the following codeExample div { width: 500px; height: 400px; background: yellow; border: 10px solid yellow; border-bottom-right-radius: 150px; background-image:url('https://www.tutorialspoint.com/latest/electronic_measuring_instruments.png'); animation: myanim 3s infinite; background-position: bottom left; background-size: 50px; } @keyframes myanim { 20% { background-color: maroon; background-size: 90px; border-bottom-color: green; border-bottom-right-radius: 50px; } } Performing Animation bottom border right radius
Read MoreAnimate bottom CSS property
To implement animation on the bottom property with CSS, you can try to run the following codeExample div { width: 200px; height: 300px; background: yellow; border: 10px solid red; animation: myanim 3s infinite; bottom: 30px; position: absolute; } @keyframes myanim { 20% { bottom: 100px; } } Performing Animation for bottom property
Read More