QP School
Apply CSS3 styles to HTML - Printable Version

+- QP School (https://qomplainerzschool.lima-city.de)
+-- Forum: Tutorials (https://qomplainerzschool.lima-city.de/forumdisplay.php?fid=3)
+--- Forum: CSS3 Tutorials (https://qomplainerzschool.lima-city.de/forumdisplay.php?fid=5)
+--- Thread: Apply CSS3 styles to HTML (/showthread.php?tid=5161)



Apply CSS3 styles to HTML - Qomplainerz - 07-26-2023

Assumed you have an HTML5 document and a separated CSS3 file, the example would be:

HTML part:

<!DOCTYPE html>
<html>
<head>
  <title>Applying Styles to HTML Example</title>
  <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
  <h1>Welcome to My Website</h1>
  <p>This is a paragraph with some text.</p>
</body>
</html>

CSS part:

/* styles.css */
h1 {
  color: blue;
  text-align: center;
}

p {
  font-size: 16px;
}

Explanation:

To apply CSS styles to HTML, we create a separate CSS file (styles.css in this example) and link it to the HTML document using the <link> element. In the CSS file, we define styles for the h1 element to set the text color to blue and center align the text. Additionally, we apply a font size of 16 pixels to all p elements.