1.内联式引用:直接用在标签上,但维护成本高

style='font-size:16px;color:#000000'

2.外部连接式引用:css代码与html代码分离,便于代码重复使用

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

style.css文件内容如右:

.font{color:blue;font-size:12px;}

3.内部式引用:页面较为清晰,但不能被别的页面使用

<style type='text/css'>
.font{color:blue;font-size:12px;}
</style>

4.外部导入式:可以在一个HTML文件中导入多个样式表。类似于外部链接式引用
    在HTML文件中head标签中加入

<style type='text/css'>
@import url('./style/style.css');
</style>

引入css的四种方式的更多相关文章

  1. sess文件编译输出css的四种方式以及使用

    sess文件输出css有下面四种方式: :nested(嵌套) :compact(紧凑) :expanded(展开) :compressed(压缩) 如何使用: sass --watch style. ...

  2. CSS学习(一)---使用CSS的四种方式

      1. 行内样式 例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  3. HTML中引入CSS的四种常用方法及各自的缺点

    在HTML中引入CSS的方法主要有四种,它们分别是行内式.内嵌式.链接式和导入式. 1.行内式 行内式是在标记的style属性中设定CSS样式.这种方式没有体现出CSS的优势,不推荐使用.格式如下: ...

  4. PHP中引入文件的四种方式详解

    四种语句 PHP中有四个加载文件的语句:include.require.include_once.require_once. 基本语法 require:require函数一般放在PHP脚本的最前面,P ...

  5. 引入CSS的三种方式

    虽然入职已经大半年,并自诩前端工程师,但是我真的不会……(有一种我有罪我该死的感觉 从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 1.内联式 内联式css样式表就 ...

  6. 引入css的两种方式

    摘自:https://www.cnblogs.com/gyjWEB/p/4831646.html 在HTML中引入css的其中的两个方法: 1.如果使用链接式,需要使用如下的语句引入外部css文件: ...

  7. 引入css的几种方式

      使用CSS样式的几种方式 CreateTime--2017年10月11日16:45:26 Author:Marydon a.外部样式 a1.链接式(推荐使用) <link href=&quo ...

  8. 引入样式表(css)的四种方式

    一.使用style属性: 将style属性直接加在html标签里. <标签 style="属性1: 设定值1; 属性2: 设定值2; "> 例如: <td sty ...

  9. vue引入css的两种方式

    方案1.在main.js中引入方式    import '@/assets/css/reset.css' 方案2.在.vue文件的<style/>标签里面引入    @import &qu ...

随机推荐

  1. 异 形 卵 709 南阳oj

    http://acm.nyist.net/JudgeOnline/problem.php? pid=709 异 形 卵 时间限制:1000 ms  |  内存限制:65535 KB 难度: 描写叙述 ...

  2. IOS-Storyboard控制器切换之Modal(1)

    Modal模式是指模态切换.新开的界面会挡住之前的界面,使之不能获取焦点. 创建一个singleView模板的程序,打开storyboard文件.拖动2个UIViewController到界面中.按住 ...

  3. 服务器可用的Socket

    "; IPAddress ServerIp = IPAddress.Parse("112.124.46.251"); IPEndPoint iep = new IPEnd ...

  4. Linux/Android——input子系统核心 (三)【转】

    本文转载自:http://blog.csdn.net/jscese/article/details/42123673 之前的博客有涉及到linux的input子系统,这里学习记录一下input模块. ...

  5. Linux ALSA声卡驱动之一:ALSA架构简介【转】

    本文转载自:http://blog.csdn.net/droidphone/article/details/6271122 声明:本博内容均由http://blog.csdn.net/droidpho ...

  6. URAL 1003,1004

    1003: 并查集在处理矛盾关系的应用,讲的比较好的题解 #include <map> #include <set> #include <list> #includ ...

  7. Groonga开源搜索引擎——列存储做聚合,没有内建分布式,分片和副本是随mysql或者postgreSQL作为存储引擎由MySQL自身来做分片和副本的

    1. Characteristics of Groonga ppt:http://mroonga.org/publication/presentation/groonga-mysqluc2011.pd ...

  8. 【转载】limits.h

    limits.h专门用于检测整型数据数据类型的表达值范围. <limits.h>主要提供对整型和字符型范围的限制的宏,同样没有指定类型和函数的定义. 1.整型宏如下表: 2.字符型宏如下表 ...

  9. [2017SEERC]Divide and Conquer

    https://www.zybuluo.com/ysner/note/1308834 题面 一个有\(n\)个点的图,上面有有两棵不同的生成树.问至少切断几条边,可以使原图不联通.并输出方案数. \( ...

  10. vue 基础知识 随笔

    window.localStorage.gettItem("someItem"||[])//如果localStorage中的someItem不存在就返回一个空数组 window.l ...