html+css的三种方式

最新推荐文章于 2024-05-18 12:54:30 发布

tigerto

最新推荐文章于 2024-05-18 12:54:30 发布

阅读量494

点赞数

分类专栏： web 文章标签： html css

本文链接：https://blog.csdn.net/GSCurry/article/details/71170486

版权

web 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

html+css的三种方式

内联方式
内部样式表方式
外部引用CSS方式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"> 
        <title>菜鸟教程(runoob.com)</title> 
        <!-- 外部引用CSS方式 -->
        <link rel="stylesheet" type="text/css" href="styles.css">
        <!--style.css:
                h3{
                    color:blue;
                    margin-left:20px;
                }

                p{
                    color:red;
                }
        -->
        <!-- 内部样式表方式 -->
        <style type="text/css">h2 {color:purple;margin-left:20px}</style>
    </head>

    <body>
        <!-- 内联方式 -->
        <h1 style="color:red;margin-left:20px;">内联样式</h1>
        <p>在HTML元素中使用"style"属性</p>

        <!-- 内部样式表方式 -->
        <h2>内部样式表</h2>
        <p>在HTML文档头部&lt;head&gt;区域使用&lt;style&gt;元素来包含CSS</p>

        <!-- 外部引用CSS方式 -->
        <h3>外部引用</h3>
        <p>使用外部CSS文件</p>
    </body>

</html>