Hey everyone! I'm working on a landing page for a beginner web development course, and I've hit a snag. I found a font on Google Fonts called "Ovo" that I want to use, but it seems like the title font won't change from the default "Montserrat" that my template is using. It's just staying bold without any change. Also, when I try to change the font, the Instagram, Twitter, and Facebook icons in the top right corner disappear. I suspect this might be related to the CSS or HTML, especially under the section labeled "". Right now, I don't see any code for the Ovo font there.
On another note, is it necessary to have a style.css file linked to my index.html? I've noticed some templates already have CSS for navigation included, but they don't come with a separate style.css file. Do I need to create one for changing fonts?
I'll share my modified "index.html" and the original "index copy.html" for reference! Thanks for any help!
2 Answers
You can absolutely customize a template without a style.css file, but creating one is a good idea for personal projects. That way, you can maintain clear separation between your custom styles and the template's built-in styles. If you're using a lot of external resources like fonts or icons, it can save you headaches later on when you need to change things up.
It sounds like you might not have linked the Ovo font correctly in your HTML. Make sure you're including the `` tag for the font in the `` section of your HTML. For the icons disappearing, double-check the CSS classes for those icons; they might be reliant on the previous font settings. As for the style.css, it isn't strictly required if your template has inline CSS, but having a separate file can make managing styles much easier as your project grows!
Yeah, definitely ensure your font link is at the top. Also, be cautious with any font-weight changes, as that can affect icon visibility too. Just good practice to keep styles organized!
Exactly! Think of it as a toolkit; a separate CSS file helps you adjust things without digging into the template code each time. Makes life easier!