🚶‍➡️ HTML & CSS Demos and Tutorials

🏷️ Topics in this Repo

• Basic HTML Tags
  Fundamental HTML elements and usage examples.
• 1-100 HTML CSS JS Animation Effects
  A collection of creative animation effects using HTML, CSS, and JS.
• ::After & ::Before CSS Pseudo Elements
  Best box corner images and pseudo-element examples.

1. Basic HTML Tags

📌 Basic HTML Tags

html head body title meta style

📝 Text Formatting

h1-h6 p br strong em hr

🔗 Links & Media

a img video audio iframe

📋 Lists

ul ol li dl dt dd

📦 Layout

div section article nav header footer

2. All Screen Shots of 1-100 HTML CSS JS Animation Effects

---

00

Start From 786

Go to File

---

01

Filter Propert

Go to File

---

02

The clip-path property allows you to make complex shapes in CSS by clipping an element to a basic shape

• circle
• ellipse
• polygon
• inset
• etc....

I Use This Website For CSS Shapes bennettfeely.com/clippy

---

03

Image Hover Effect ▶️

Go to File

---

04

Button Box Shadow Effect

go to file

---

05

Image in Text

go to file

---

06

linear-gradient background

go to file

---

07

gradient border

go to file

---

08

CSS Snipper like :

• type ! for CSS Basic Boiler plate code
• type center for CSS Flex Center on the cotainer

go to file

---

09

shadow in Image

go to file

---

10

Border On Text (Stroke)

go to file

---

11

Font Fider Extension

go to file

---

12

color Zilla Extension

Detect Every color of web page , detect images color on the webpage ,every thing . etc

go to file

---

13

::Selection CSS Element

go to file

---

14

let a = 10; VS let b = "10";

go to file

---

15

== VS ===

go to file

---

16

Color full Scroll Bar

go to file

---

17

Animated Laoder

go to file

---

18

Under Line Animation

go to file

---

19

How to Remove Any Image background

go to file

---

20

< mark/> Tag

go to file

---

21,22

::before And ::after Pseudo elements

go to file

---

23

nth-child() Selector in CSS

go to file

---

24,25,26

:hover & :active selectors

go to file

---

27

Simple Scroll Slider

go to file

---

28

Import Fonts locally

go to file

---

32

Genrate Random Number (.js)

go to file

---

33

Heart Shape Using ::before & ::after

go to file

---

34

background blur effect

go to file

---

35

:root Varibale in CSS

go to file

---

36

calc fnx in CSS

go to file

---

37

nowrap and text ellipsis

go to file

---

38

Neumorphism UI

neumorphism generator

go to file

---

39

Glassmophism UI

glassmorphism generator

go to file

---

40

Red Rod (box-shadow Effect)

go to file

---

41

linear-gradient for text

go to file

---

42

@keyframes text animation

go to file

---

43

Add Download feature in website

go to file

---

44

counter function in css

go to file

---

45

confirm js JavaScript

go to file

---

3. ::before and ::after example

go to folder

---