Learn CSS pseudo-elements in 5 minutes! ✔

Показать описание

#CSS #course #tutorial

CSS pseudo-elements tutorial example explained ::before ::after

Рекомендации по теме

Комментарии

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bro Code</title>
<link rel="stylesheet" href="style.css">
</head>
<body>

<h1>Hello</h1>

<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus fuga ullam quas corporis vel reprehenderit molestiae nam velit. Ut nulla vitae nobis tenetur voluptatibus reiciendis. Distinctio possimus fuga doloribus reprehenderit.</p>

<ul id="fruit">
<li id="apple">apple</li>
<li id="orange">orange</li>
<li id="banana">banana</li>
</ul>

</body>
</html>

/* style.css */

h1::first-letter{
font-size: 2em;
font-style: italic;
}
p::first-line{
background-color: hsl(60, 100%, 77%);
}
p::selection{
color: rgb(89, 255, 71);
background-color: hsl(0, 0%, 21%);
}
#fruit li::before{

}
#apple::after{
content: "🍎";
}
#orange::after{
content: "🍊";
}
#banana::after{
content: "🍌";
}
#fruit li::marker{
content: "✔";
color: hsl(120, 100%, 64%);
font-size: 1.2em;
}

BroCodez

This is Guy is a super teacher. I on watch all his video once and my brain absorbs 98% of his teaching....

AvidAfrican

I don't have idea how you do it. But it's amazing how easy I can understand with you. Thanks

bryanstevgarcespena

Excellent explanations and techniques 😊

sweethomes

In the name of Bro, and Code and Holy CSS, Amen!

konstantinzakharov

5:56 lol you explain better than my instructor in my paid course

Ferry

bro, why are you always switching the color scheme to hsl? btw I LOVE your videos, you make education much better and fun ❤❤❤

nonna_eml

Lost out on an interview last year when they asked me about this 😢

hotwings

How come all of your freaking videos in the freaking HTML playlist unlisted? For some reason it's annoying to look at. Please make them public.

omairtech

Learn CSS pseudo-elements in 5 minutes! ✔

Learn CSS pseudo-elements in 5 minutes! ✔

Learn CSS Pseudo Elements In 8 Minutes

Learn CSS pseudo elements in 4 minutes 🔎

Learn CSS pseudo-classes in 7 minutes! ☟

Learn CSS pseudo classes in 5 minutes 👨‍👧‍👦

CSS Pseudo Elements Explained in 7 Minutes

Pseudo Classes CSS , Pseudo Elements, ::before and ::after in CSS | Web Development Course #31

CSS Pseudo-classes: in 100 Seconds

(5) CSS: Pseudo Selectors

36: CSS Pseudo Elements and Classes | Style Part of an Element | Learn HTML and CSS | Full Course

3 Amazing Pseudo Elements You Have Probably Never Used

Learn Every CSS Selector In 20 Minutes

CSS for beginners | Learn CSS Pseudo Elements In 5 Minutes

CSS Pseudo Elements: What they are & how to use them

CSS Tutorial: Before and After Pseudo Selectors | Web Development Tutorials #33

CSS’s :target pseudo-class is surprisingly powerful

You Still Don’t Understand Before and After Pseudo-Elements | CSS Course

Before and after css pseudo elements

25. Pseudo Elements in CSS || CSS Tutorial for Beginners in Telugu

CSS Selectors #5 | Pseudo Elements | Design a button using ::before & ::after | Easy explanatio...

Learn CSS In Arabic 2021 - #34 - Pseudo Classes

CSS pseudo-element ::first-letter selector

A simple micro interaction using pseudo elements 💬

CSS Pseudo Classes vs Pseudo Elements Explained (with examples)