前言

1995年,W3C发布了CSS草案

1996年,W3C正式推出CSS1

1998年,推出CSS2

2001年从CSS3开始,CSS这门语言分割成多个独立的模块,每个模块独立分级,且只包含一小部分功能;

2011年开始设计CSS4

本文将主要介绍引入CSS样式的方式,包括外部样式表、内部样式表和行间样式三种方式

[注意]CSS语法非常简单,但容易忽略的一点是不能省略分号(最后一个样式除外)

外部样式表

<link rel="stylesheet" type="text/css" href="sheet1.css" media="all" />

内部样式表

<style>
body{
background-color: red;
}
</style>

[注意]文档中可出现多个style标签,且样式规则与层叠样式规则一致

【使用@import指令】

@import指令用于指示Web浏览器加载一个外部样式表,并在表现HTML文档时使用其样式。唯一的区别在于命令的具体语法和位置。

@import指令常用于样式表需要使用另一个样式表中的样式的情况。

<style>
@import url(sheet2.css);
body{
background-color: red;
}
</style>

[注意]@import必须出现在style元素中,且要放在其他CSS规则之前,否则将根本不起作用。

行间样式

如果只是想为单个元素指定一些样式,可以使用HTML的style属性来设置一个行间样式。

<body style="background-color: red; height: 100px; border: 10px solid black;" style="background-color: red;">

[注意]行间样式若存在多个style属性,只能识别第一个

[注意]<style>标签和<link>标签可以写在<body>标签里面

css文件引人的三种方式的更多相关文章

  1. 用python查看文件是否存在的三种方式

    目录 1.使用os模块 判断文件是否可做读写操作 2.使用Try语句 3. 使用pathlib模块 正文 通常在读写文件之前,需要判断文件或目录是否存在,不然某些处理方法可能会使程序出错.所以最好在做 ...

  2. ListView适配器获取布局文件作为View的三种方式

    第一种方法: public View getView(int position, View convertView, ViewGroup parent) { View view = null; if ...

  3. HTML-CSS文件链接HTML的三种方式

    <!--css文本的链接方式有三种:分别是内联定义.链入内部css.和链入外部css--> <!--1.代码为:--> <!--<html> <head ...

  4. python文件上传的三种方式

    def upload(request): return render(request, 'upload.html') def upload_file(request): username = requ ...

  5. log4net 控制台和文件和数据库输出三种方式

    1.新建console应用项目SendEvaluateDataToProvinceConsole 2.选择SendEvaluateDataToProvinceConsole项目右键 选择 管理NuGe ...

  6. 三种方式上传文件-Java

    前言:负责,因为该项目他(jetty嵌入式开始SpringMvc)实现文件上传的必要性,并拥有java文件上传这一块还没有被曝光.并 Http 更多晦涩协议.因此,这种渐进的方式来学习和实践上载文件的 ...

  7. python 获取表单的三种方式

    条件:urls.py文件中配置好url的访问路径.models.py文件中有Business表. 在views.py文件中实现的三种方式: from app01 improt models def b ...

  8. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  9. CSS控制样式的三种方式优先级对比验证

    入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分 ...

随机推荐

  1. Saltstack_使用指南03_配置管理

    1. 主机规划 注意事项 修改了master或者minion的配置文件,那么必须重启对应的服务. 2. 了解YAML 具体地址 https://docs.saltstack.com/en/latest ...

  2. java 非访问修饰符 final 的用法

    final 修饰符,用来修饰类.方法和变量 final修饰的类不能被继承 举例,String类是final类,不可以被继承: final修饰的方法不能被重写 只是不能重写,也就是不能被子类修改,但是可 ...

  3. Linux Collection:软件配置

    PAS Debian 9安装最新版Firefox( Firefox 58+/Quantum) Debian 9(Strech)的仓库包含的是firefox-esr(52)版本:需要安装最新版,有如下两 ...

  4. 英语口语练习系列-C06-购物

    <水调歌头>·苏轼 明月几时有,把酒问青天. 不知天上宫阙,今夕是何年? 我欲乘风归去,又恐琼楼玉宇, 高处不胜寒. 起舞弄清影,何似在人间! 转朱阁,低绮户,照无眠. 不应有恨,何事长向 ...

  5. HBase 数据模型

    在HBase中,数据是存储在有行有列的表格中.这是与关系型数据库重复的术语,并不是有用的类比.相反,HBase可以被认为是一个多维度的映射. HBase数据模型术语 Table(表格) 一个HBase ...

  6. Cloudera Manager(CDH5)内部结构、功能包括配置文件、目录位置等

    1. 相关目录 /var/log/cloudera-scm-installer : 安装日志目录./var/log/* : 相关日志文件(相关服务的及CM的)./usr/share/cmf/ : 程序 ...

  7. vue 组件中的钩子函数 不能直接写this

    export default { data(){ return { num: 18 } }, beforeRouteEnter(to, from, next){ next(vm=>{ vm.nu ...

  8. MongoDB 创建基础索引、组合索引、唯一索引以及优化

    一.索引 MongoDB 提供了多样性的索引支持,索引信息被保存在system.indexes 中,且默认总是为_id创建索引,它的索引使用基本和MySQL 等关系型数据库一样.其实可以这样说说,索引 ...

  9. jconsole连接本地进程报安全连接失败

    连接本地程序报错 在idea工具中添加如下命令 -Djava.rmi.server.hostname=127.0.0.1 -Dcom.sun.management.jmxremote.port=888 ...

  10. 洛谷 P1091 合唱队形

    \[传送门在这里呀\] 题目描述 \(N\)位同学站成一排,音乐老师要请其中的\((N-K)\)位同学出列,使得剩下的\(K\)位同学排成合唱队形. 合唱队形是指这样的一种队形:设K位同学从左到右依次 ...