Course: Welcome

Other ways to bring in CSS [9/14]

It is quite troublesome to set every tag’s style using the style attribute. Also, it pollutes the HTML code with excess recurrent CSS pieces.

Luckily, there are other means to connect styles. The first one is to connect an external file using the tag <link>, and the second one is to use the special tag <style>. We will pay attention to these methods in further courses.

And now, you are going to meet the second editor window that is marked as . The code from CSS editor is used in the HTML document as if you entered it into the <style> tag.

At first we will scrub the code in HTML editor, and then we will apply styles to our mini-summary using other means of CSS step by step.

Do it
<!DOCTYPE html> <html> <head> <title>Other ways to bring in CSS</title> </head> <body> <h1>Course summary</h1> <p style="color: green;">Paired tags.</p> <p style="color: green;">Single tags.</p> <p style="color: green;">Tag attributes.</p> <p style="color: green;">Inline (built in) styles.</p> <p style="color: red;">Outer styles.</p> <p style="color: red;">Styling by class.</p> </body> </html>
/* body { font-family: Tahoma, serif; } p { color: green; }
HTML Academy
  1. Delete all style attributes from the paragraphs,
  2. after that delete the symbols /* from the first line of CSS editor.
Theory Check Next