Pseudo style

Developer
Iharosi
Size
2,514 Kb
Views
10,120
  1. Pseudo style Previews
  2. Pseudo style HTML Codes
  3. Pseudo style CSS Codes

How do I make an pseudo style?

What is a pseudo style? How do you make a pseudo style? This script and codes were developed by Iharosi on 16 January 2023, Monday.

Pseudo style Previews
IQ Test

Pseudo style - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>pseudo style</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <ol> <li>I have to tell you about the future.</li> <li>I know what you're gonna say, son, and you're right, you're right, But Biff just happens to be my supervisor, and I'm afraid I'm not very good at confrontations.</li> <li>This is more serious than I thought.</li> <li>Apparently your mother is amorously infatuated with you instead of your father.</li> <li>Maybe you were adopted. Right, I got it.</li>
</ol>
</body>
</html>

Pseudo style - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=Roboto:100,300);
body { font-family: 'Roboto', sans-serif; font-size: 48px; font-weight: 100; color: #003869; padding: 1em;
}
ol { margin: 1.5em;
}
ol li { position: relative; padding: 0.5em 0; z-index: 3;
}
ol li:before { content: ''; font-weight: 300; position: absolute; top: 0.3em; left: -2em; padding: 0.2em; display: inline-block; width: 1em; height: 1em; background-color: #005cab; color: white; border-radius: 50%; text-align: center; z-index: 2;
}
ol li:after { content: ''; position: absolute; top: 0.4em; left: -1.35em; width: 0.8em; height: 0.8em; background-color: #005cab; transform: rotate(-75deg); z-index: 1;
}
ol > li:nth-child(1):before { content: '1';
}
ol > li:nth-child(2):before { content: '2';
}
ol > li:nth-child(3):before { content: '3';
}
ol > li:nth-child(4):before { content: '4';
}
ol > li:nth-child(5):before { content: '5';
}
Pseudo style - Script Codes
Pseudo style - Script Codes
Home Page Home
Developer Iharosi
Username iharosi
Uploaded January 16, 2023
Rating 3
Size 2,514 Kb
Views 10,120
Do you need developer help for Pseudo style?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Iharosi (iharosi) Script Codes
Name
Animated line drawing in SVG
Hyphenation
Paper like css box shadow
Backdrop Filters with Safari 9
Close shade example
Highlight selected dom
Img srcset attribute test
Crafting link underlines
SVG morph anim with Snap.svg
A Pen by iharosi
Create amazing Facebook ads with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!