CSS / Pseudo Code

Author: mhasanmeet

b. CSS/Pseudo Code/ReadMe.md

@@ -0,0 +1,14 @@
+## Pseudo Code 
+
+### Pseudo Element (::)
+
+* ::after, ::before -- Both the ::before and ::after pseudo-elements create a child element inside an element only if you define a ```content: " ";``` property.
+* ::first-letter, style of the first character of the target property
+* ::first-line, style of the first line of the target property
+* ::marker, style of the browser maker property
+* ::selection, style of the selected text
+* ::placeholder, style for placeholder texts
+* ::cue, Style for video captions
+
+### Pseudo Class (:)
+

b. CSS/Pseudo Code/pseudo-class.css

@@ -1,13 +1,4 @@
-/* 
-
-    CSS Pseudo Code
-    -------
-    1. Pseudo Class
-    2. Pseudo element
-
-*/
-
-/*----- Make an underlying dash (Pseudo element)  ------*/
+/*----- Make an underlying dash  ------*/
 h1::after{
     content: "";
     display: block;
@@ -17,7 +8,32 @@ h1::after{
     margin: 0.5 auto 0;
 }
 
-/*------- list marker selector coloring (Pseudo element) ----------*/
+/*------- First Character Styling ----------*/
+
+p::first-letter{
+    color: goldenrod;
+    font-weight: bold;
+}
+
+/*------- First Line Styling ----------*/
+
+p::first-line{
+    color: blue;
+    float: left;
+    font-size: 2.6em;
+    font-weight: bold;
+    line-height: 1;
+    margin-inline-end: 0.2rem;
+}
+
+/*------- The ::selection pseudo-element allows you to style how selected text looks. -------*/
+
+p::selection {
+    background: green;
+    color: white;
+}
+
+/*------- list marker selector coloring ----------*/
 /*
     <ul>
         <li>A</li>