CSS的引入方式----行内式、嵌入式、链接式

本文介绍了CSS的三种引入方式:行内样式表(行内式)、内部样式表(嵌入式)和外部样式表(链接式)。详细讲解了每种方式的特点和优缺点,包括代码复用性、样式权重、结构与样式分离以及加载效率等。同时提到了导入式样式的使用注意事项和潜在问题。
摘要由CSDN通过智能技术生成

CSS的引入方式

按照CSS样式书写的位置(或引入的方式),CSS样式表可以分为三大类
1、行内样式表(行内式)
2、内部样式表(嵌入式)
3、外部样式表(链接式)

一、内部样式表(嵌入式)
(1)是写到html页面内部,是将所有的CSS代码抽取出来,单独放到一个style标签中
(2)style理论上可以放到html的任何一个地方,但通俗的约定放在文档的head标签中
通过此种方式,可以方便控制当前整个页面中的元素样式设置
优缺点:代码结构清晰,但没有实现结构与样式完全分离

还有一种导入式
在内联样式中通过 @import 方法,导入其他样式,提供给当前页面使用。
使用导入样式的缺点
1、导入样式,只能放在 style 标签的第一行,放其他行则会无效。
2、@import 声明的样式表不能充分利用浏览器并发请求资源的行为,其加载行为往往会延后触发或被其他资源加载挂起。
3、由于 @import 样式表的延后加载,可能会导致页面样式闪烁。

二、行内样式表(行内式)
是在元素标签内部的style属性中设定CSS样式。适合于修改简单样式。

 <p style="
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值