Use the RGBA() values for CSS transparency. Set the alpha channel parameter to specify the opacity for color − .transparent { background-color: rgba(0, 0, 255, 0.582); } RGBA color value includes the rgba(red, green, blue, alpha). Here, the alpha is to be set for transparency i.e. − 0.0: fully transparent 1.0: fully opaque Transparency With RGBA The following is the code for implementing CSS transparency using RGBA. Here, we have set the alpha parameter to a value 0.582 for transparency − Example ... Read More
To show how to put an icon inside an input element in a form using CSS, use the Font Awesome. For adding the font awesome icons on a web page, include the CDN − Place Icons Inside an Input Element We have used the Font Awesome icons here for Username, Email and password − Icon for the Username For the Username, the following icon is included − ... Read More
We can style the file upload button using the CSS pseudo element ::file-selector-button. However, the full support of this pseudo element is limited to Firefox and Firefox Android. The ::-webkit-file-upload-button is used to support Safari, Chrome and Opera. Syntax The syntax of CSS file-selector property is as follows − Selector::file-selector-button { attribute: /*value*/ } Selector::-webkit-file-upload-button { attribute: /*value*/ } Style File Upload Button With ::file-selector-button The following example illustrate CSS file-selector-button selector. On hover, we have styled it like this − input[type=file]::file-selector-button:hover { cursor: grab; ... Read More
Using the CSS :not() pseudo-class, we can refine our styling by selecting those elements which do not have a specific value or does not match a selector. Select Elements not Having a Child Selector To select elements not having a child selector, use the :not pseudo-class in CSS. Here, we have a child selector. The CSS child selector is used to select all the child elements with a particular parent element. It selects all the elements that are children of i.e. div>p But we have selected elements not having this div>p − p:not(div>p) { ... Read More
The text-overflow property is used in CSS3 to determine how overflowed content that is not displayed is signalled to users. Syntax The following is the syntax of the text-overflow property − text-overflow: value; The value can be clip, ellipsis, string, and initial. You can set any text using the string value. The ("...") t is shown for the clipped text when the ellipsis value is used. The following is the code for handling text overflow in CSS3 − Clip the Text In this example, the overflow text is clipped and cannot be accessed using the text-overflow property with ... Read More
We will now be able to explicitly set display type of elements by two valued syntax of CSS display. This will allow us to change the flow layout of element. Display an Inline Element The following examples illustrate CSS display property with multi-keyword − display: inline flow-root; The inline displays an element as an inline element whereas with the flow-root, the element generates a block box that establishes a new block formatting context. Example Let us see the example − body, div, span { ... Read More
The property opacity is the modern solution and works for Firefox , Safari, Opera, and every version of chrome. The -moz-opacity property is the opacity property for Firefox versions older than 0.9 while the –khtml-opacity property is for safari versions starting with 1. Using all these values together as a fallback for modern opacity allows us to use opacity in all browsers − .transparent { filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3; } Opacity That Works on all Browsers For image opacity that works in ... Read More
To set opacity to work in all modern web browsers like Firefox, Google Chrome, Opera, etc., use the opacity property and set under CSS class − transparent{ opacity: 0.3; } The following is the code to work with opacity in modern browsers − Change the Opacity Example In this example, we have changed the opacity of an image using the opacity property − body{ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; ... Read More
The ANSI-SPARC database architecture is the basis of most of the modern databases.The three levels present in this architecture are Physical level, Conceptual level and External level.The details of these levels are as follows −Physical LevelThis is the lowest level in the three level architecture. It is also known as the internal level. The physical level describes how data is actually stored in the database. In the lowest level, this data is stored in the external hard drives in the form of bits and at a little high level, it can be said that the data is stored in files ... Read More
Smartphones are the friendly gadgets which have made everything reachable through a touch. They have occupied such a huge place in our daily lives that it is no wonder that for most of us, a smartphone is the first thing we look at in the morning and it is the last thing we see before going to bed.Now, there will certainly be some advantages and a few disadvantages while using any electronic gadget. Let’s observe them:AdvantagesKeep your loved ones in touch, either through calls, text or images, .which express the feeling in a sweet and amusing way.You may know where ... Read More