Some text
\n", " ```\n", "\n", "- But styles can also be specified separately via a `.css` file. In that file, one uses **CSS Selectors** to identify which tags should be styled and how. For example, if I want _all_ my `` tags to have the same style, I'd write:\n", "\n", " ```css\n", " p {\n", " margin-bottom:10px;\n", " background-color:red;\n", " color:white\n", " }\n", " ```\n", "\n", " When I load this CSS file into my HTML, the styling above will apply to all `
`s.\n", "\n", " For the above to work, I'd have to add the following to my HTML document:\n", "\n", " ```html\n", " \n", "
\n", " \n", " \n", "\n", " \n", " ...\n", " \n", " \n", " ```\n", "\n", "\n",
"```\n",
"\n",
"I could specify the **CSS selector** as:\n",
"\n",
"```css\n",
"p#uniquely-huge {\n",
" ...
Some text
\n", "\n", "Some text with coloured background
\n", "\n", "Some text with coloured background
\n", "\n", " \n", " \n", "\n", "```\n", "\n", "Suppose we also have a `my_styles.css` file as below:\n", "\n", "```css\n", "p {\n", " margin-bottom:10px;\n", "}\n", "\n", "p.coloured {\n", " background-color:red;\n", " color:white\n", "}\n", "\n", "#uniquely-huge {\n", " font-size: 2em;\n", "}\n", "```\n", "\n", "This will render as:\n", "\n", "![Screenshot 2024-02-11 130802.png](