As I delve into the world of HTML and CSS as a relative beginner, I've been following tutorials on w3schools while also trying out my own experiments. One obstacle I encountered early on involved the code below:
<!DOCTYPE html>
<html>
<head>
<title>vector5 - Home</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:100" rel="stylesheet">
<style>
<!-- Link Styling-->a {
text-decoration: none;
color: #6a9496;
}
a:visited {
text-decoration: none;
color: #6a9496;
}
(more code...)
</style>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body style="background-color: #99bfc1;">
<h1 style="color: #6a9496; font-family: 'Roboto'; font-size: 200%;">Lorem Di Ipsum</h1>
<p style="margin-top: 0px; margin-bottom: 0px; margin-right: 250px; margin-left: 100px; border: 10px solid powderblue; color: #757575; text-align: justify; font-size: 100%; font-family: 'Roboto', sans-serif;"
title="Lorem Di Ipsum">
Lorem Ipsum is simply dummy text of the printing and typesetting industry, used for <b><abbr title="Hypertext Markup Language">HTML</abbr></b> and design in modern times. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when a unknown
printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,
but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with
the release of Letraset sheets containing cursive cursive Lorem Ipsum passages, and more recently with desktop publishing
software like Aldus PageMaker including versions of Lorem Ipsum. To learn more about the <i>'Lorem Di Ipsum test'</i>,
you can visit <a href="https://www.cs.tut.fi/~jkorpela/www/justify.html" style="text-decoration: none;" target="_blank">this website</a>.
</p>
</body>
</html>While styling the paragraph element directly worked fine, when I removed the inline styling from the paragraph within the body section and left the CSS styling in the head intact, the text on the browser defaulted back to the original (black Times New Roman font). The reason behind this behavior eludes me, and I'm seeking clarification from someone who might shed light on this issue.
Another query that I have pertains to using different font weights within the same paragraph but of the same font family. How can I achieve this stylistic variation?