Struggling to style HTML elements with CSS
Background Information
- I am currently learning front-end development and created a test page for practice.
Steps Taken So Far
- In the main directory, I created a file called
test.html
and added the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/csstest.css">
<title>Document</title>
</head>
<body>
<p> text number one</p>
<p class="test_class"> text number two</p>
</body>
</html>
- Furthermore, I created a folder named
css
and within it, a file namedcsstest.css
.
p [class = "test_class"] {color: red;}
Purpose and Attempts
I intended to select the text "text number two" and change its color to red using CSS.
While my original approach did not work as expected, I discovered that wrapping the text in a span element like this was successful:
<p><span class="test_class"> prueba numero dos</span></p>