(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. PAT (Advanced Level) 1082. Read Number in Chinese (25)

    模拟题. #include<cstdio> #include<cstring> #include<cmath> #include<vector> #in ...

  2. rsync+inotify实现数据的实时备份

    一.rsync概述 1.1.rsync的优点与不足 rsync与传统的cp.tar备份方式相比,rsync具有安全性高.备份迅速.支持增量备份等优点,通过rsync可以解决对实时性要求不高的数据备份需 ...

  3. MAC 10.10解决 PHP GD库的问题

    1. http://yangjunwei.com/a/1570.html 2. http://php-osx.liip.ch

  4. (简单) POJ 2251 Dungeon Master,BFS。

    Description You are trapped in a 3D dungeon and need to find the quickest way out! The dungeon is co ...

  5. iOS推送跳转AppDelegate跳转VC

    在开发项目中,会有这样变态的需求: 推送:根据服务端推送过来的数据规则,跳转到对应的控制器 feeds列表:不同类似的cell,可能跳转不同的控制器(嘘!产品经理是这样要求:我也不确定会跳转哪个界面哦 ...

  6. runtime - associated(关联)

    category和associative作为objective-c的扩展机制的两个特性,category用来扩展类的方法,associative可以用来扩展类的属性.使用associative需要导入 ...

  7. HTML中meta的应用

    meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta 标签用 于网页的<head>与</head>中,meta 标签的用处很多.meta 的属性有两种:name ...

  8. LPC1788的ADC和DAC使用

    #ifndef __ADC1_H_ #define __ADC1_H_ #include "common.h" #include "delay.h" void ...

  9. 最小化安装Linux记录

    挂载点: /boot 挂载点  100M swap 交换分区 / 根分区 最小化安装: 基本--基本.兼容库.调试工具 开发--开发工具 修改hostname 永久设置:/etc/sysconfig/ ...

  10. IM 融云 之 列表及封装

    // // ChatListIMViewController.m // testRongCloudIM // // Created by WoodGao on 16/1/8. // Copyright ...