CSS

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Pseudo selectors & more designing </ title >     < link rel = "stylesheet" href = "CSS/styleEight.css" > </ head > < body >     < div class = "container" id = "cont1" >         < h3 > This is my heading </ h3 >         < p > Lorem, ipsum dolor sit amet consectetur adipisicing elit. Minima fugit hic culpa debitis saepe qui ducimus             corporis! Aut totam odio laboriosam, facilis quibusdam eos repudiandae officiis dicta magni, cumque error             rem iste sapiente? Repellendu...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Alignment </ title >     < link rel = "preconnect" href = "https://fonts.googleapis.com" >     < link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin >     < link         href = "https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Playwrite+AT:ital,wght@0,100..400;1,100..400&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap"         rel = "stylesheet" >     < link rel = "stylesheet" href = "CSS/styleSeven.css" > </ he...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Box Model </ title >     < link rel = "stylesheet" href = "CSS/styleSix.css" > </ head > < body >     < div class = "container" >         < h3 > This is my heading </ h3 >         < p id = "first" > Lorem ipsum dolor sit amet consectetur, adipisicing elit. Possimus, minus soluta tempora in             repellat eius ad             nisi sunt recusandae at itaque molestiae architecto tenetur accusantium suscipit eligendi aliquam. Odio,             tempore. </ p...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > Height, Width, borders and backgrounds </ title >     < link rel = "stylesheet" href = "CSS/styleFive.css" > </ head > < body >     < h3 > This is heading </ h3 >     < p id = "firstPara" > This is a paragraph </ p >     < h3 > This is second heading </ h3 >     < p id = "secondPara" > This is my second paragraph </ p >     < h3 > This is third heading </ h3 >     < p id = "thirdPara" > This is my third paragraph </ p > </ body > </ html > CSS File #firstPara {     background-color : red...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > CSS Colors </ title >     < link rel = "stylesheet" href = "CSS/styleFour.css" > </ head > < body >     < h2 > This is my first box </ h2 >     < p id = "firstPara" > This is a paragraph from first box </ p >     < h2 > This is my second box </ h2 >     < p id = "secondPara" > This is a paragraph from second box </ p >     < h2 > This is my third box </ h2 >     < p id = "thirdPara" > This is a paragraph from third box </ p > </ body > </ html > CSS File #firstPara {   ...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > CSS Fonts </ title >     < link rel = "preconnect" href = "https://fonts.googleapis.com" >     < link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin >     < link         href = "https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Playwrite+AT:ital,wght@0,100..400;1,100..400&display=swap"         rel = "stylesheet" >     < style >         p {             font-family : "Playfair Display" , "serif" , "Franklin Gothic Medium" , "...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > CSS Selectors </ title >     <!--<style>         Element selector         p {             color: red;         }         Id selector         #redElement {             color: green;         }         .secondPara {             color: yellow;         }         Class selector         .bgBlue {             background-color: bl...

  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < meta http-equiv = "X-UA-Compatible" content = "ie=edge" >     < title > CSS Tutorial </ title >     < style >         p {             color : white ;             background-color : green ;             border : 2px solid #000 !important ;         }     </ style >     < link rel = "stylesheet" href = "CSS/style.css" > </ head > < body >     <!--Inline CSS will take more precedence-->     <!--In Internal and External CSS, the precedence will be get which written Last as compare to each other-->   ...