(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控制都是针对本页面标签的,没有多余的CSS命令;再者不用外链CSS文件。直接在HTML文档中读取样式。缺点就是改版麻烦些,单个页 面显得臃肿,CSS不能被其他HTML引用造成代码量相对较多,维护也麻烦些。但是采用这种方法的公司大多有钱,对他们来说用户量是关键,他们不缺人进 行复杂的维护工作。

(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. 计算机学院大学生程序设计竞赛(2015’12) 1006 01 Matrix

    #include<stdio.h> #include<string.h> #include<iostream> #include<algorithm> ...

  2. USACO刷题之路

    重拾经典 本科生涯结束了,在大学做的ACM竞赛现在基本忘的差不多了.USACO作为一个经典的题库,本来是面向OI选手的,但是由于题目质量很高所以受到大家的好评,所以我这次就从它开始我的刷题之路吧. 由 ...

  3. Linux在shell中df半天没反应

    问题描述:  df -hT 一直没反应,只能Ctrl+c中断此操作! 解决方法: 多是mount挂载远程服务,而远程服务已关闭,出于一直mount状态,df  -hT是查看本地挂载和远程挂载! df  ...

  4. unity3d之在屏幕上画线

    如何在屏幕上画线,简单的代码如下: using UnityEngine; public class Test : MonoBehaviour { void OnGUI() { GL.LoadOrtho ...

  5. EasyUi中的datagird中a标签的click事件无法触发?(已解决)

    ***************************2015-10-29 21:07************************* 问题如下: datagrid最后一列编辑中有如下a标签 { f ...

  6. PHP 反射应用之一(插件框架)

    http://www.zui88.com/blog/view-205.html 反射,非常有用的一套东西,用来在运行时,分析代码,分析类的属性,方法,参数,实例化类,调用类的方法等等,从而实现框架,实 ...

  7. Zipf’s Law

    Let f(w) be the frequency of a word w in free text. Suppose that all the words of a text are ranked ...

  8. Ubuntu的Redis安装

    转自:http://blog.fens.me/linux-redis-install/ 1. Redis在Windows中安装 在Windows系统上安装Redis数据库是件非常简单的事情,下载可执行 ...

  9. python_json常用的方法

    1. 什么是JSON? JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端 ...

  10. 关于iOS后台模式

    https://onevcat.com/2013/08/ios7-background-multitask/ http://zhidao.baidu.com/link?url=NUOMrLGB6Odr ...