#css #webdev #beginners #codenewbie

The author describes their fourth day of learning the MERN stack, where they began using CSS to style HTML after three days of building structure. They learned the three methods of attaching CSS, chose the external file method for cleanliness, and practiced basic selectors and rules. The author also converted a navigation list into a horizontal layout and plans to study core CSS layouts next.

Hello Dev Community 👋 It is Day 4 of my journey toward mastering the MERN stack. For the past three days, I was busy building skeletons with HTML. Today, I finally started bringing those dry structures to life using CSS Cascading Style Sheets It felt amazing to move away from black text on a plain white screen and actually control how things look. I learned that there are three methods to attach styles to HTML, but one is clearly the professional standard: <style tag in the HTML head..css file and linking it via <link rel="stylesheet" . I chose this method because it keeps my HTML clean and modular.I mastered the basic anatomy of a CSS rule: Selector { Property: Value; } . I experimented with three primary selectors today: body , h1 .. : The most reusable way to style elements e.g., .btn-primary . : For styling a single, unique element e.g., main-header .I took the semantic "About Me" page and navigation bar that I refactored yesterday and created an external style.css file for it. Today, I didn't worry about complex layouts. Instead, I focused on the basics: <li into an inline layout so they sit horizontally like a real navbar, instead of a vertical bulleted list.Tomorrow, I'm diving into the absolute core of CSS layouts: To the senior engineers: What is your favorite CSS font stack for clean, readable code? To fellow beginners: Did you start with Inline CSS or go straight to External files? My styled code and repository are up to date on GitHub Links in the Comments Keep coding 🚀