首页如何在html中写css样式

如何在html中写css样式

时间: 2024-05-07 13:17:46 浏览: 11

您可以使用以下方式在HTML中编写CSS样式： 1. 内部样式表：在HTML文档中使用```<style>```标签来定义CSS样式，如下所示： ``` <!DOCTYPE html> <html> <head> <title>My Title</title> <style> body { background-color: #f1f1f1; } h1 { color: blue; font-size: 24px; } </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html> ``` 2. 外部样式表：将CSS样式定义在一个单独的CSS文件中，并在HTML文档中使用```<link>```标签引用该文件，如下所示：在index.html文件中： ``` <!DOCTYPE html> <html> <head> <title>My Title</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html> ``` 在style.css文件中： ``` body { background-color: #f1f1f1; } h1 { color: blue; font-size: 24px; } ``` 3. 内联样式：在HTML标签中使用```style```属性来定义CSS样式，如下所示： ``` <!DOCTYPE html> <html> <head> <title>My Title</title> </head> <body> <h1 style="color: blue; font-size: 24px;">This is a heading</h1> <p style="background-color: #f1f1f1;">This is a paragraph.</p> </body> </html> ```