首页前端开发其他前端知识HTML怎么调用外部css,有几种方法

HTML怎么调用外部css,有几种方法

时间2024-03-28 14:02:03发布访客分类其他前端知识浏览1168
导读:这篇文章主要给大家介绍“HTML怎么调用外部css,有几种方法”的相关知识,下文通过实际案例向大家展示操作过程,内容简单清晰,易于学习,有这方面学习需要的朋友可以参考,希望这篇“HTML怎么调用外部css,有几种方法”文章能对大家有所帮助。...
这篇文章主要给大家介绍“HTML怎么调用外部css,有几种方法”的相关知识,下文通过实际案例向大家展示操作过程,内容简单清晰,易于学习,有这方面学习需要的朋友可以参考,希望这篇“HTML怎么调用外部css,有几种方法”文章能对大家有所帮助。

调用方法:1、使用“link rel="stylesheet" href="css文件路径" type="text/css" /> ”语句调用;2、在style标签中使用“@import url(CSS文件路径地址)”语句调用。

本教程操作环境:windows7系统、CSS3& & HTML5版、Dell G3电脑。

html调用外部css有两种方法

  • 链接式--使用link> 标签

  • 导入式--使用@import规则标签

1、链接式

在网页的head> /head> 标签对中使用link> 标记来引入外部样式表文件,使用html规则引入外部css。

语法:

link rel="stylesheet" href="css文件路径" type="text/css" />
    

link> 标签定义文档与外部资源的关系,link> 标签最常见的用途是链接样式表。

2、导入式

CSS @import规则,用于从其他样式表导入样式规则。这些规则必须先于所有其他类型的规则,@import不能在条件组的规则中使用。

将一个独立的.css文件引入HTML文件中,使用css @import规则引入外部css文件,写在head> 标记的style> 标记中

语法:

style type="text/css">
    
@import url(CSS文件路径地址);
    
/style>
    

比较链接方式和导入方式

链接方式(下面用 link 代替)和导入方式(下面用 @import 代替)都是引入外部的 CSS 文件的方式,下面我们来比较这两种方式。

link 属于 HTML,通过 link> 标签中的 href 属性来引入外部文件,而 @import 属于 CSS,所以导入语句应写在 CSS 中,要注意的是导入语句应写在样式表的开头,否则无法正确导入外部文件;

@import 是 CSS2.1 才出现的概念,所以如果浏览器版本较低,无法正确导入外部样式文件;

当 HTML 文件被加载时,link 引用的文件会同时被加载,而 @import 引用的文件则会等页面全部下载完毕再被加载;


感谢各位的阅读,以上就是“HTML怎么调用外部css,有几种方法”的内容了,通过以上内容的阐述,相信大家对HTML怎么调用外部css,有几种方法已经有了进一步的了解,如果想要了解更多相关的内容,欢迎关注网络,网络将为大家推送更多相关知识点的文章。

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

html

若转载请注明出处: HTML怎么调用外部css,有几种方法
本文地址: https://pptw.com/jishu/654986.html
SpringMVC接收上传Excel文件中读取数据过程分析 安卓动态设置:android elevation设置透明度怎么操作?

游客 回复需填写必要信息