<style>
标签来嵌入CSS样式。你可以在<style>
标签中定义你所有需要的CSS样式,这样HTML页面在加载时就会将CSS样式应用到文档中。例如下面的示例:<!DOCTYPE html> <html> <head> <title>我的网页</title> <style> body { background-color: blue; } h1 { color: white; text-align: center; } </style> </head> <body> <h1>欢迎来到我的网页</h1> <p>这是我的第一个网页</p> </body> </html>
<style>
标签中嵌入CSS样式,将页面背景颜色设置为蓝色,将标题颜色设置为白色并居中对齐。<p>二、使用外部CSS文件<p>如果你在多个HTML页面中要使用相同的CSS样式,那么使用内部CSS会显得非常冗余,这时候我们可以使用外部CSS文件。我们新建一个以.css为后缀的文件,例如style.css,并在HTML页面的头部标签内通过<link>
标签将CSS样式文件链接到页面上。例如:<!DOCTYPE html> <html> <head> <title>我的网页</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>欢迎来到我的网页</h1> <p>这是我的第一个网页</p> </body> </html>
body { background-color: blue; } h1 { color: white; text-align: center; }
<!DOCTYPE html> <html> <head> <title>我的网页</title> </head> <body> <h1 style="color: white; text-align: center;">欢迎来到我的网页</h1> <p style="background-color: blue;">这是我的第一个网页</p> </body> </html>
<h1>
标签和<p>
标签中使用了style属性,分别定义了标题的颜色和对齐方式,以及段落的背景颜色。
<p>总结
<p>无论是内部CSS、外部CSS文件还是行内CSS,它们的最终目的都是为了美化网页的外观。在实际开发中,我们可以根据实际情况选择不同的方式进行CSS和HTML的链接。当要定义的CSS样式比较多时,我们可以使用外部CSS文件;当需要定义较少的样式时,则可以使用内部CSS或行内CSS。以上是css和html怎么连接的详细内容。更多信息请关注PHP中文网其他相关文章!