（1）链接式  ： 在网页的<head></head>标签对中使用<link>标记来引入外部样式表文件，使用html规则引入外部css  (用得比较多) :

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

（2）导入式 ： 将一个独立的.css文件引入HTML文件中，导入式使用CSS规则引入外部CSS文件，<style>标记也是写在<head>标记中，使用的语法如下：

<style type="text/css">

@import"mystyle.css"; 此处要注意.css文件的路径

</style>

比较：link引用和import引用区别是：link是html加载前就引用，而import是html加载后才引用。举例，采用impor引用，会先显示无样式的页面，然后再把样式放进去。如果用JavaScript动态引用CSS，得使用link引用方式才可实现。

（3）内联css文件，直接在header 里面写css，如：

<style type="text/css">
div{margin: 0;padding: 0;border:1px red solid;}
</style>

这种方法的使用情况要少的多，最长见得就是访问量大的门户网站。或者访问量较大的企业网站的首页。与第一种方法比起来，优点突出，弊端也明显。优点：速度 快，所有的CSS控制都是针对本页面标签的，没有多余的ＣＳＳ命令；再者不用外链ＣＳＳ文件。直接在ＨＴＭＬ文档中读取样式。缺点就是改版麻烦些，单个页 面显得臃肿，ＣＳＳ不能被其他ＨＴＭＬ引用造成代码量相对较多，维护也麻烦些。但是采用这种方法的公司大多有钱，对他们来说用户量是关键，他们不缺人进 行复杂的维护工作。

（4） 直接在标签里面写样式

<div style="border:1px red solid;">测试信息</div>

不经常改的地方 。可以一用，，但是 还是 谨慎使用，很不符合大众。

CSS 文件的4种引入方式的更多相关文章

  1. CSS文件的三种引入方式

    CSS的引入方式共有三种:行内样式.内部样式表.外部样式表. 一.行内样式 使用style属性引入CSS样式. 示例:<h1 style="color:red;">st ...

  2. CSS简单的四种引入方式

    CSS一共有四种引入方式 (1)最简单的两种方式是直接在html标签里面引入,或者在html文件前面声明,以下是简单的代码示例 <!DOCTYPE html> <html lang= ...

  3. CSS的4种引入方式及优先级

    第一:css的四种引入方式 1.行内样式 最直接最简单的一种,直接对HTML标签使用style="",例如: <p style="color:#F00; " ...

  4. js介绍，js三种引入方式，js选择器，js四种调试方式，js操作页面文档DOM（修改文本，修改css样式,修改属性）

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  5. html(常用标签,标签分类)，页面模板， CSS(css的三种引入方式)，三种引入方式优先级

    HTML 标记语言为非编程语言负责完成页面的结构 组成: 标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾 指令:被<>包 ...

  6. CSS【03】：CSS 基础选择器与三种引入方式

    基础选择器 选择器:css 选择 html 标签的一个工具,是将 css 与 html 建立起联系,那么 css 就可以控制 html 样式 选择器其实就是给 html 标签起名字 标签选择器 作用: ...

  7. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  8. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性　　定位（position）z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  9. 前端 CSS 三种引入方式

    CSS三种引入方式 行内样式 内接样式 外部样式 链接式 导入式 行内样式 就是在标签加上style属性设置样式 <!DOCTYPE html> <html lang="e ...

随机推荐

  1. php自学笔记3

    -------补充--------建议定义常量时,判断常量名是否被定义,用defined()判断,返回布尔型if(!defined("POEM")){//没定义过 define(& ...

  2. HDU 1068 Girls and Boys 二分图最大独立集（最大二分匹配）

    Girls and Boys Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  3. iOS关于UITabView和UIAlertController，UIAlertAction以及UINavigation，值修改的传递页面推送

    关于UITabView和UIAlertController,UIAlertAction以及UINavigation,值修改的传递 集合嵌套集合的操作 声明 两个必须的的代理 实现部分代码 - (voi ...

  4. FZU 1064 教授的测试

    递归构造答案. 根据当前整颗树的编号,可以计算左右子树有几个节点以及编号.因此,不断dfs下去就可以了. #include<cstdio> #include<cstring> ...

  5. Online Schema Change for MySQL

    It is great to be able to build small utilities on top of an excellent RDBMS. Thank you MySQL. This ...

  6. 如何解决Visual Studio2012 与此版本的Windows不兼容

    解决方案: http://www.microsoft.com/zh-CN/download/details.aspx?id=36020   下载更新

  7. win8.1远程连接Redis数据库

    环境:redis安装在虚拟机Centos6.5系统上 通过java远程连接 问题一:报错 connected refused redis.conf 注释掉 #bind 127.0.0.1 问题二:还是 ...

  8. java系列--HTTP协议

    一.HTTP请求信息 请求行 请求头 空行 消息体 1.防盗链: 枚举类型: 二.中文乱码问题 1.Get提交 String username = request.getParameter(" ...

  9. iOS 导航栏不可点击

    self.navigationController.navigationBar.userInteractionEnabled = NO;

  10. mysql配置主从数据库

    1.目的 1.1 实现数据备份 1.2 项目访问时可以实现读写分离,提高访问和操作数据的速度<读写分离好处> 2.背景 这次的主从配置主要实现主库数据的改变可以实现同步到从库中: 此次试验 ...