2、CSS权威指南--如何把CSS应用到HTML

link标签：作用是把其他文档与当前文档关联起来。

 

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" type=“text/css” href="../CSS/style1.css">
    <style type="text/css">
        @import url(../CSS/style2.css);
        p{
            color: aqua;
            font-size: 36px;
        }

    </style>
    <title>Document</title>
</head>
<body>
    <div>123</div>
    <p>我歌且谣</p>
</body>
</html>
复制代码

 

 

通过link标签链接的样式表不是HTML文档的一部分，但却供文档使用，我们称这样的样式表为外部样式表。

为了正确的加载外部样式表，link标签强烈建议放在head元素中。

@import url () ：@import声明 可以放在HTML文档的style标签中， 也可以放在CSS文件中。不管那种方式，都应该放在其他CSS规则之前：

@import url(../CSS/style2.css);
div{
    width: 100px;
    height: 100px;
    color: burlywood;
    font-size: 36px;
}

一个文档中可以有多个@import语句，他们都会被加载。

外部样式表保存为纯文本文件，扩展名通常是  .css

一个文档可以关联多个样式表，浏览器会合并样式规则后再应用到文档上。

style元素也是一种引入样式表的方式，应该始终设定type值，CSS文档的type=“text/css” ， 这与link是一样的。

style标签之间的样式称为文档样式表（document stylesheet）或嵌入式样式表（embedded  stylesheet）。可以直接包含要应用到文档上的样式， 或包含@import指令，引入外部样式表。

如果只想为单个元素添加少量样式， 不值得动用嵌入式样式表或外部样式表，可以才用HTML元素的style属性，设置行内样式：

 <div style="color:brown">我歌且谣</div>

注意：style属性的值只能是样式规则声明。

 

posted @   我歌且谣  阅读(97)  评论(0)  编辑  收藏  举报
相关博文：
· 5、CSS权威指南--媒体查询
· 3、CSS权威指南--CSS样式表内容规则的结构
· HTML link 标签和script标签
· CSS 链接（link） 用法运用 详解
· HTML 样式- CSS
阅读排行：
· Manus重磅发布：全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示