W3docs

css

Which HTML tag specifies an internal style sheet?

Pratique Seu Conhecimento

Which HTML tag specifies an internal style sheet?

Explicação

Understanding the Use of HTML Tag for Internal Style Sheets

The HTML tag is used to specify an internal style sheet in a web page. It allows you to include CSS style rules directly within your HTML document. The tag can be placed anywhere within the head section of the document, from where it can apply global style rules to your web page.

An internal style sheet is useful when you want to style a single HTML document. They are appropriate when the style is specific to a single page and is not required to be applied to other web pages.

Practical Example of Using the Tag

Below is an example of how you can use the tag to include an internal style sheet in your HTML document:

<!DOCTYPE html>
<html>
<head>
  <style>
    body {
      background-color: lightblue;
    }

    h1 {
      color: navy;
    }

    p {
      color: red;
    }
  </style>
</head>

<body>
  <h1>This is a Heading</h1>
  <p>This is a paragraph.</p>
</body>
</html>

In this example, the tag is used within the head section to set the background color of the page, the color of h1 headings, and the color of paragraphs.

Best Practices and Additional Insights

  • The styles in an internal style sheet should be surrounded with CSS comment tags (/* and */), in order for the browser to ignore them if it can't understand CSS.

  • Despite its usefulness, internal style sheets can lead to a lot of redundancies if you have the same style rules applied across multiple pages. In such cases, it is better to use an external style sheet. You can use the tag to link an external CSS file to your HTML document.

  • The CSS rules placed within the tag will overwrite any conflicting style rules placed within an external style sheet that is linked to the same HTML document. This is due to the principle of 'Cascading' in CSS whereby the closest style to an element takes precedence.

In conclusion, the HTML tag provides an efficient way of creating an internal style sheet, allowing for a unique style to be applied to individual HTML pages. However, in order to maintain cleaner and more efficient code, it's optimal to resort to external style sheets when dealing with multiple web pages and overlapping styles.

Quer mais? Faça o quiz completo de CSS Basics.

Iniciar Quiz