目录
百战程序员,全站22050+开发课程+文档 ,学习精选优质好课快人一步!观看视频 快捷键ALT+N

web前端全系列 教程

1839个小节阅读:2243.5k

收藏
全部开发者教程

鸿蒙应用开发

C语言快速入门

JAVA全系列 教程

面向对象的程序设计语言

Python全系列 教程

Python3.x版本,未来主流的版本

人工智能 教程

顺势而为,AI创新未来

大厂算法 教程

算法,程序员自我提升必经之路

C++ 教程

一门通用计算机编程语言

微服务 教程

目前业界流行的框架组合

web前端全系列 教程

通向WEB技术世界的钥匙

大数据全系列 教程

站在云端操控万千数据

AIGC全能工具班

A

A A

White Night

阅读(2.8k)
赞(0)

CSS的引入方式

image-20211130111128496

内联样式(行内样式)

要使用内联样式,你需要在相关的标签内使用样式(style)属性。Style 属性可以包含任何 CSS 属性

温馨提示

缺乏整体性和规划性,不利于维护,维护成本高

内部样式

当单个文档需要特殊的样式时,就应该使用内部样式表。你可以使用 <style> 标签在文档头部定义内部样式表

温馨提示

单个页面内的CSS代码具有统一性和规划性,便于维护,但是在多个页面之间容易混乱

外部样式(推荐)

当样式需要应用于很多页面时,外部样式表将是理想的选择。在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表。 <link> 标签在(文档的)头部

导入式(了解)

此种方式使用率比较低,因为会影响加载速度

@import和link的区别

  1. @importCSS提供加载样式的一种方式,只能用于加载CSSlink标签除了可以加载CSS外,还可以做很多其它的事情,比如定义rel连接属性等
  2. 加载顺序的差别。当一个页面被加载的时候,link引用的CSS会同时被加载,@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候会比较明显
  3. 兼容性的差别。@importIE5以上才能识别,而link标签无此问题
  4. 使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为dom操作元素的样式时,用@import方式的样式也许还未加载完成
  5. 使用@import方式会增HTTP请求,会影响加载速度,所以谨慎使用该方法

实时效果反馈

1.外部CSS样式的引入方式,以下正确的是:

A <style></style>

B <link rel="stylesheet" type="text/css" href="xxx.css">

C <p style="background: orange; font-size: 24px;">CSS<p>

D @import url("css文件路径")

答案

1=>B

北京市昌平区回龙观镇南店村综合商业楼2楼226室

©2014-2023 百战卓越(北京)科技有限公司 All Rights Reserved.

京ICP备14032124号-2