CSS的三大样式是什么(css,开发技术)

时间:2024-04-28 15:13:54 作者 : 石家庄SEO 分类 : 开发技术
  • TAG :

    CSS%E7%9A%84%E4%B8%89%E5%A4%A7%E6%A0%B7%E5%BC%8F%E6%98%AF%E4%BB%80%E4%B9%88

又叫:内联样式、行内样式、嵌入式样式

当样式仅需要在一个元素上应用一次时,要使用内联样式

缺点

将表现和内容混杂在一起,结构样式没有分离,不利于后期维护

样式不能重复使用 ( 推荐不使用 )

当单个文档需要特殊的样式时,使用内部样式表

适合案例、短小的页面开发

使用<style>标签在文档头部定义内部样式表

<style>标签放在哪里都可以,不一定要放在<head>里面。之所以放在<head>里面,是为了让浏览器在加载的时候先加载CSS,这样的话浏览器就会先心里有数,知道谁要修饰成什么样式,等加载到html之后就可以直接把样式给到相关对象上。

优点:结构样式分离,好维护

缺点:只能在一个页面中使用CSS样式

当样式需要应用于很多页面时,外部样式表将是理想的选择

适合整站开发、比较长的页面开发

在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观。每个页面使用<link>标签链接到样式表,浏览器会从CSS文件中读到样式声明,并根据它来格式文档

优点

结构化样式分离,好维护

样式重用,可以多个页面使用

<link>import的区别

当使用JavaScript控制DOM去改变样式的时候,只能用<link>标签

因为@import不是DOM可以控制的

@import是CSS2.1提供的,所以老的浏览器不支持,@import只有在IE5以上的才能识别

<link>标签无此问题

<link>是当页面 ( body里面的内容 ) 被加载的时候 ( 也就是被浏览者浏览的时候 ),<link>引入的CSS会同时被加载

import引入的CSS会先等页面加载完毕之后再加载,如果用这种加载方式,会在网速比较慢的时候,出现闪烁的效果,影响用户体验

本质上来看,<link>是HTML的标签,而import是CSS提供的一种方式

加载顺序上

兼容性上的区别

使用DOM

多重样式优先级

同时使用内部、外部、行内样式表修饰同一个标签的时候,优先级最高的是行内样式表,即显示结果是行内样式

当外部和内部样式表同时使用的时候,哪个css样式距离标签近就最终显示哪个样式

本文:CSS的三大样式是什么的详细内容,希望对您有所帮助,信息来源于网络。
上一篇:怎么用python画一只帅气的皮卡丘下一篇:

3 人围观 / 0 条评论 ↓快速评论↓

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18