html
  1. html-styles
PreviousNext

HTML Styles

  • HTML styles are used to format the layout of a web page.
  • CSS (Cascading Style Sheets) is used to style HTML and can be used to alter text size and fonts used, add borders and drop shadows, layout your page with columns, and much more

How to Use Styles in HTML

There are three ways to use styles in HTML:

  1. Inline styles

    You can add styles directly to an HTML element using the style attribute.

    <p style="color: red; font-size: 16px;">This is a paragraph.</p>
  2. Internal styles

    You can add styles to the <head> section of an HTML document using the <style> tag.

    <head>
  <style>
    p {
      color: red;
      font-size: 16px;
    }
  </style>
</head>
<body>
  <p>This is a paragraph.</p>
</body>
  3. External styles

    You can create a separate CSS file and link it to your HTML document using the <link> tag.

    <head>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <p>This is a paragraph.</p>
</body>

Styling Elements

CSS can be used to style any HTML element, including headings, paragraphs, links, images, and more. Here is an example of how to style a paragraph using CSS:

p {
  color: green;
  font-size: 20px;
}
Try Playground

Importance of Styles

  • HTML styles help to improve the visual appeal of a web page and make it more user-friendly.
  • Styles can be used to create a consistent look and feel across multiple pages on a website.
  • Search engines use styles to index the structure and content of web pages.
ParagraphsImages
Published on: