CSS (Cascading Style Sheets) is a fundamental component of web design that enhances the visual appeal and aesthetics of websites. There are various types of CSS that developers can utilize to style their web pages. Each type has its own syntax, usage, and advantages. In this article, we will explore the three primary types of … Read more
Add active class to a div on javascript onclick event Here we are applying a style to a simple div. Steps to add a css class on click event Create a div with specific id (here id=”text”) on click on div call a method makeActive() Define a function makeActive() in side <script> tag. Inside makeActive() … Read more
Padding in CSS is the term given to the inner space of an element around its content. CSS allows you to control all the padding of an element; top, bottom, left and right. The corresponding properties for each side are: padding-top padding-bottom padding-left padding-right A general example for the padding can be:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <style> div { background-color: wheat; padding-top: 60px; padding-right: 50px; padding-bottom: 60px; padding-left: 50px; border: 1px solid; } </style> <div> CSS Padding </div> |
The values … Read more
With a wide range of devices being able to access the internet, it is very necessary to make the websites easily operable on all these devices. A website that looks great on the laptop screen should retain its swagger on the mobile phone screen as well. To serve this purpose, CSS provides a feature called, … Read more
There’s often a need to list items on the webpage in an orderly fashion. These items can be ordered products in a wish-list or Steps to be followed in a tutorial. Making a dynamic list that can add counters to the list element is another popular feature provided by CSS. CSS counters are, basically, “variables” … Read more
Just like any programming language works, the CSS code is also interpreted based on some rules.Here, the browser interprets what is called the style rules.Based on the rules, it applies the design to the corresponding elements of the webpage. The style rule can be seen as following 3 parts: Selector – This is the HTML part … Read more
Several CSS properties like height, width, margin, font-size etc. requires length values. To express these lengths, CSS supports two types of units namely, absolute and relative. Absolute length units are static irrespective of the screen size and hence are used when the output display size is known, like the print layout. Relative length units are … Read more
CSS3 provides the facility to change shape, size, and position of the element with the help of transform property. There are two types of transformations namely, 2D and 3D. Transformation allows to rotate, translate, shift and scale elements. In this, we will learn about only 3D transformation. In the 3D transformation, the effects are produced … Read more
CSS3 provides the facility to change shape, size, and position of the element with the help of transform property. There are two types of transformations namely, 2D and 3D. Transformation allows to rotate, translate, scale, and skew elements. In this, we will learn about only 2D transformation. In the 2D transformation, the effects are produced … Read more
Buttons give a feel of automation to the websites. A button pressed here can redirect you to another page, or may bring something new to current page. CSS has a lot to style the buttons using its numerous properties. The basic outlook of a button is a standard rectangular image with some instructive text written … Read more
