css如何引入外部样式表

技术css如何引入外部样式表这篇文章将为大家详细讲解有关css如何引入外部样式表,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 引入方法:1、使用link标

本文将详细解释如何在外部样式表中引入css。边肖觉得挺实用的,分享给大家参考。希望你看完这篇文章能有所收获。

导入方式:1。使用链接标记导入,语法为“link href='css文件路径' rel='样式表'/”;'/";2.在样式标记中使用“@import”规则,语法为“@import url('css文件路径')”;" .

本教程操作环境:windows7系统,CSS3HTML5第5版,戴尔G3电脑。

必须先将外部样式表导入到网页文档中,浏览器才能识别和解析它。外部样式表文件可以通过两种方式导入到HTML文档中。

1、使用 link 标签导入

使用链接标记导入外部样式表文件:

Linkhref='外部样式表文件路径' rel='样式表'类型=' text/CSS '/每个属性的描述:

Href属性设置外部样式表文件的地址,可以是相对地址,也可以是绝对地址。

rel属性定义了关联的文档,这意味着关联的样式表就是样式表。

type属性定义导入文件的类型。与style元素一样,text/css被表示为一个css文本文件。

一般在定义链接标签时,需要定义三个基本属性,其中href是必须设置的属性。

您还可以将title属性添加到link元素中,以设置可选样式表的标题,也就是说,当多个样式表导入到网页文档中时,可以通过title属性值来选择要应用的样式表文件。

提示:在火狐浏览器中,可以在菜单中选择“视图-页面样式”选项,然后子菜单中会显示标题属性值。您可以通过选择不同的标题属性值来选择性地应用所需的样式表文件。IE浏览器不支持此功能。

此外,标题属性与rel属性相关。按照W3C的规划,未来的web文档会使用多个链接元素导入不同的外部文件,比如样式表文件、脚本文件、主题文件,甚至是个人定制的其他补充文件。导入这么多不同类型和名称的文件后,您可以使用title属性来选择它们。这时,rel属性的作用就变得明显了。它可以指定网页文件初始显示时要应用的导入文件类型,目前只能与CSS样式表类型关联。

外部风格是CSS应用的最佳方案。一个样式表文件可以被多个网页引用,同时一个网页文件可以通过重复使用链接元素导入不同的样式表文件来导入多个样式表。

2、使用 @import 关键字导入

使用样式标签中的@import关键字导入外部样式表文件:

styletype='text/css '

@importurl('外部样式表文件路径');

/style在@import关键字之后,使用url()函数包含特定外部样式表文件的地址。

对比

两种导入样式表的方法比较:

链接属于HTML标签,@import由CSS提供。

加载页面时,会同时加载链接,而@import引用的CSS会等到页面加载完毕。

@import只能在IE 5以上才能识别,而link是一个HTML标签,所以不存在兼容性问题。

链接样式的权重高于@import。

一般建议使用link导入样式表,@import可以作为补充方法。

我希望这篇关于“css如何引入外部样式表”的文章能在这里分享。

内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/82729.html

(0)

相关推荐

  • HTML文档类型DTD与浏览器怪异模式的示例分析

    技术HTML文档类型DTD与浏览器怪异模式的示例分析这篇文章主要为大家展示了“HTML文档类型DTD与浏览器怪异模式的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“H

    攻略 2021年11月24日
  • 如何用3个步骤实现响应式Web设计

    技术如何用3个步骤实现响应式Web设计本篇文章给大家分享的是有关如何用3个步骤实现响应式Web设计,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。写在前面的话

    攻略 2021年11月17日
  • leetcode排序链表怎么用(leetcode单链表反转)

    技术LeetCode如何k个一组翻转链表这篇文章给大家分享的是有关LeetCode如何k个一组翻转链表的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。 题目描述:给你一个链表,每 k 个节点一组

    攻略 2021年12月15日
  • 如何进行web.py数据库入门

    技术如何进行web.py数据库入门如何进行web.py数据库入门,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。web.py是一个非常精巧的web框架,不

    攻略 2021年12月4日
  • 如何安装系统监控工具glances

    技术如何安装系统监控工具glances本篇文章为大家展示了如何安装系统监控工具glances,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。作为运维不仅要时时监控系统,还需要优雅的

    攻略 2021年12月9日
  • 11.9

    技术11.9 11.9属性1.attr(name|properties|key,value|fn)概述设置或返回被选元素的属性值。参数name String属性名称properties Map
    参数

    礼包 2021年11月9日