This content originally appeared on DEV Community and was authored by Harikrishnan Rajagopalan
Hi there đź‘‹,
I'm a front-end developer with 3 years of experience. I've always wanted to bridge the gap in my knowledge and become a full-stack developer. I've made several attempts to start The Odin Project but haven't been able to consistently follow through. This time, I'm determined to stick with it and improve my skills.
To track my progress, I'll be publishing a series of blog posts detailing my learnings from each Odin Project chapter. Consider these as my development diaries.
I will be adding the topics I learned and share stuff I didn't knew before.
I'm starting with CSS as HTML and all the introductory stuff I have gone through previously or atleast I'm aware of.
Topics Learned
- Selectors
- Universal Selector
- Type Selector
- Class Selector
- ID Selector
- Grouping Selector
- Chaining Selector
- Combinator I did know about how to use combinator but I wasn't aware of that specific term. Also the definition that it's about a relationship between selectors other than grouping or chaining them.
- Descendent Combinator
Basic CSS Properties
- color, background-color
- Typography
- Font family and generic font family
Image height and width
So, another thing I learned here is that, It's advisable to always specify both width and height attributes for images in HTML. This ensures that the browser reserves the appropriate space for the image during page rendering, preventing unexpected shifts in content layout when images load. To maintain the original aspect ratio of an image, you can change only the width attribute and set the height to 'auto'. This will automatically adjust the height based on the image's proportions.External CSS
Internal and Inline CSS
I recall an instance when my tech lead added inline CSS to our HTML. I hesitated to question his decision, as he was a seasoned professional and I was still relatively new to the field.
However, I now understand that a more effective approach would have been to suggest that we minimize the use of inline CSS. By limiting inline styles to only those absolutely necessary for the rule to function, we can avoid over-applying specificity and maintain a cleaner, more maintainable codebase.
I'm also planning to publish a weekly podcast recapping the things I learned.
This content originally appeared on DEV Community and was authored by Harikrishnan Rajagopalan
Harikrishnan Rajagopalan | Sciencx (2024-09-08T04:52:27+00:00) The Odin Project -Intro to CSS. Retrieved from https://www.scien.cx/2024/09/08/the-odin-project-intro-to-css/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.