Overview

The pure-css-animated-border is a CSS3 animated border that is compatible with all modern browsers. It allows for the creation of various animated border effects using only CSS.

Features

• Supports all modern browsers
• Allows for the creation of animated border effects using CSS
• Provides a range of pre-defined class names for different border animations

Installation

To install the pure-css-animated-border, follow these steps:

1. Include the CDN link in your HTML file’s head section:

<link rel="stylesheet" href="cdn-link">

2. Add the necessary CSS class to your HTML element:

<span class="ui-border-element"> Your Content... </span>

3. Choose one of the available class names from the list:

• .ui-box .topBottom-leftRightCorner
• .ui-box .topBottom-rightLeftCorner
• .ui-box .forwardBorderTrain
• .ui-box .backwardBorderTrain
• .ui-box .border-inOutSpread
• .ui-box .slideOpposite
• .ui-box .top-leftToRight
• .ui-box .right-topToBottom
• .ui-box .bottom-rightToLeft
• .ui-box .left-bottomToTop
• .ui-box .top-rightToLeft
• .ui-box .right-bottomToTop
• .ui-box .bottom-leftToRight
• .ui-box .left-topToBottom
• .ui-box .top-inOutSpread
• .ui-box .right-inOutSpread
• .ui-box .bottom-inOutSpread
• .ui-box .left-inOutSpread
• .ui-box .top-slideOpposite
• .ui-box .right-slideOpposite
• .ui-box .bottom-slideOpposite
• .ui-box .left-slideOpposite
• .ui-box .top-leftStart
• .ui-box .top-rightStart
• .ui-box .bottom-rightStart
• .ui-box .bottom-leftStart
• .ui-box .top-leftStart-backward
• .ui-box .top-rightStart-backward
• .ui-box .bottom-rightStart-backward
• .ui-box .bottom-leftStart-backward
• .ui-box .top-leftStart-burst
• .ui-box .top-rightStart-burst
• .ui-box .bottom-rightStart-burst
• .ui-box .bottom-leftStart-burst
• .ui-box .top-leftStart-burst-backward
• .ui-box .top-rightStart-burst-backward
• .ui-box .bottom-rightStart-burst-backward
• .ui-box .bottom-leftStart-burst-backward
• .ui-box .top-stay

4. Replace "Your Content..." with your desired content.

## Summary
The pure-css-animated-border is a CSS3 animated border that offers a range of animation effects using only CSS. It supports all modern browsers and provides a simple and easy way to add animated borders to your website or application.