前言

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. LeetCode算法题-Minimum Index Sum of Two Lists（Java实现）

    这是悦乐书的第272次更新,第286篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第139题(顺位题号是599).假设Andy和Doris想要选择一家餐馆吃晚餐,他们都有 ...

  2. Spring Boot 2.x 快速入门（下）HelloWorld示例详解

    上篇 Spring Boot 2.x 快速入门(上)HelloWorld示例 进行了Sprint Boot的快速入门,以实际的示例代码来练手,总比光看书要强很多嘛,最好的就是边看.边写.边记.边展示. ...

  3. OpenResty：通过 Lua 扩展 NGINX 实现的可伸缩的 Web 平台

    关于 http://openresty.org/cn/about.html 这个开源 Web 平台主要由章亦春(agentzh)维护.在 2011 年之前曾由淘宝网赞助,在后来的 2012 ~ 201 ...

  4. HttpServletResponse简单理解

    Web服务器收到一个http请求,会针对每个请求创建一个HttpServletRequest和HttpServletResponse对象,从客户端取数据用HttpServletRequest,向客户端 ...

  5. python实现数据结构单链表

    #python实现数据结构单链表 # -*- coding: utf-8 -*- class Node(object): """节点""" ...

  6. Luogu P1852 BZOJ 2144 [国家集训队]跳跳棋

    qwq 这题一看就不会,如果不是gg让做我是坚决不会做的 画图模拟,因为一次只能跳过一个棋子,所以对于一种情况只有三种移动方式: 中间向左跳 中间向右跳 左或右(距中间近的那个)向中间跳 发现,除了跳 ...

  7. iOS开发基础篇-手写控件

    一.手写控件的步骤 1)使用相应的控件类创建控件对象: 2)设置该控件的各种属性: 3)添加空间到视图中: 4)如果是 UIButton 等控件,还需考虑控件的单击事件等: 二.添加 UIButton ...

  8. 在Asp.Net Core中使用DI的方式使用Hangfire构建后台执行脚本

    最近项目中需要用到后台Job,原有在Windows中我们会使用命令行程序结合计划任务或者直接生成Windows Service,现在.Net Core跨平台了,虽然Linux下也有计划任务,但跟原有方 ...

  9. jquery动态设置图片路径和超链接href属性

    js document.getElementById("myImage").src="hackanm.gif"; jquery $("#img&quo ...

  10. webpack4

    本地安装: npm init -y cnpm install webpack webpack-cli webpack-dev-server --save-dev 然后装一些所需要的loader和插件: ...