How to Build Your First Website from Scratch
Introduction Developing your first website is a thrilling and rewarding activity. Whether you are developing a personal portfolio or building a business or just wanting to try web development for fun, this guide takes a systematic approach to get you started. Step 1: Define the Purpose of the Website and Plan It Before you splash […]
Hazel CV HTML CSS Project
Introducing The Project Starting this project by using Images Click Here. Setting Up the Navbar Hazel | CV Blog Speaking Events Hazel Contact Me /* CSS Code*/ body { padding: 0; margin: 0; } .hero { height: 90vh; background-color: #f08e80; } .navbar { display: flex; justify-content: space-between; align-items: center; color: white; padding: 24px 32px; } […]
Specificity and The Cascade
The Sibling Combinator Adjacent Combinator The + combinator selects elements that are directly after the first element. H1 + p { } Siblings Combinator The ~ combinator selects siblings, the 2nd element must follow the 1st element (immediately or not), and must share the same parent. H1~p { } Working with Pseudo-Classes Button:hover { } […]
The Box Model
Introducing The Box Model It is a concept that every single element in the browser is a box. And we can control different properties of the box. Three main parts Margin: the distance from another box. Padding: the distance within the box. Border: the boundaries of the box. Working With Borders Border Color We use […]
CSS Selectors
The Universal Selector *{ } It is universal selector which select all the elements. The Attribute Selector This allows to select elements based upon the particular attribute Input [type= “email”] { } Email, checkbox, text, password are included in it. We have others attributes a[href*= “wiki”] { Color: blue; } a[href^=” #”] { Color: gold; […]
Styling Text in CSS
Changing Fonts with Font-Family We use one font at a time or list but a name where two words it come between “”. Another name of list font called font stack. Font-family: Georgia, serif; Font-size, Font-Weight, and Font-Style Font-size: The words are used small, large, 1.2em, x-small, 12px, 80%, etc. Default size: 32px. It is […]
The World of CSS Colors
Named Colors There are named colors as well as other colors like RGB and hexadecimal color There are 140+ pre-defined named colors that are pick from (check on website) Color: red; Understanding RGB Colors RGB colors are simplification for Red Green Blue. We use rgb (0,0,0); to specify the color. First letter is for Red, […]
CSS Basics
CSS Structure CSS stands for Cascading Styles Sheet h1{ color: blue; } Working Within Inline Styles blah blah blah Inside opening tag Writing Internal Styles Write in head element. Only exits in that page External Styles the Best Way to Write Styles Make app.css named file in same directory where you write all of CSS […]