HTML/CSS

How To Make Grid and List View Option Using HTML/CSS

Submitted by alpha_luna on

Good Day!!!

In this tutorial, we are going to learn How To Make Grid and List View Option. In this project, you can manage your content easily by viewing optionally. We have two types to view our content. We have Grid and List View in this project. For the ListView, it is item-by-item of records of names, things and others in our content or in the linearly ordered data structure. For the GridView, is a versatile control used to accept and display on a web page.

Responsive Navigation with HTML/CSS

Submitted by tmohlatlole on
For the mark-up, create file and name it index.html. CSS only Demo Responsive Show Menu Home About Who We Are What We Do Portfolio Photography Web & User Interface Design Illustration News Contact Now we come to css, create a file and name it main.css. #container { display: block; width: 100%; margin: 1.09123432523124534% auto; } header{ display: block; padding-bottom: 50px; } ul { list-style-type

Simple Countdown Event Using HTML AngularJS

Submitted by alpha_luna on
This is a simple countdown event created using HTML, CSS, and AngularJS. This can be used in advertising an event to any websites. Try it yourself and enjoy coding. You can use it in a different kinds of event. Just download the source code and use it to your project. Hope this work will help you in your future project. For more information, click here.

Simple Slider Tab Menu in HTML/CSS and JavaScript

Submitted by alpha_luna on
This is simple tab menu created using HTML/CSS and Javascript. On click to the menu, special effect play and underline slides to the clicked menu. If you are comfortable with the source code, then you can download a zip file with all the codes. Hope this will help you in your future project. Enjoy coding.

Animation Timing Function in CSS3

Submitted by alpha_luna on

Good day!

In this tutorial, we are going to learn about animation-timing-function. What is animation-timing-function? animation-timing-function property specifies the speed curve of the animation. The speed curve defines the amount of time an animation uses to change from one set of CSS styles to another. Syntax of this property: animation-timing-function: linear | ease | ease-in | ease-out | ease-in-out | cubic-bezier (n,n,n,n) | initial | inherit ; Property Values

Animation Direction in CSS3

Submitted by alpha_luna on
What is animation-direction? The animation-direction property specifies whether or not the animation should play in reverse direction or in alternate cycles. If the animation-direction value is "alternate", the animation played as normal every odd time (1,3,5,etc...) and backwards every even time (2,3,6,etc...). Note: If the animation is set to play only once, this property will have no effect

Animation Delay Property in CSS3

Submitted by alpha_luna on
Let's discuss, what is a animation-delay in CSS3. The animation-delay property specifies when the animation should start. The animation-delay value can be defined in seconds (s) or milliseconds (ms). Syntax of this property: animation-delay: time | initial | inherit ; Property Values: time - it specifies the time (can be a negative number) before the animation begins. This is a time difference