CSS引用外部样式表的优点:一般的浏览器都带有缓存功能,所以用户不用每次都下载此CSS文件,所以外部引用相对于内部引用和内联引用来说是是节省资源的。

CSS使用内部样式表、内联样式表的优点:可以直观的看到CSS代码,可以方便的修改并观察更改后的效果。

一:引用外部样式表方式一,使用link标签引用CSS

<head>
<link rel="stylesheet" type="text/css" href=http://www.yoursite.com/style.css />
</head>

文件路径可以使用相对路径或者绝对路径。

二:引用外部样式表方式二,使用@import引用CSS

<head>
<style type="text/css">@import url(http://www.yoursite.com/style.css);</style>
</head>

文件路径可以使用相对路径或者绝对路径。

三:内部样式表

<style type="text/css">
li{list-style-type: none;}
a{text-decoration:none;}
.red{color:#f00;}
</style>

style标签正常情况应该放在head标签内部。

四:内联样式表

<p style="font-size: 10px; color: #FFFFFF;">
使用CSS内联引用表现段落.
</p>

CSS的引用方式(引用外部样式表、内部样式表、内联样式表)的更多相关文章

  1. CSS3——注释 id 和 class 选择器 css创建(外部、内部、内联样式表)

    注释 /*         注释内容          */ id 和 class 选择器 id   ID属性不要以数字开头,数字开头的ID在 Mozilla/Firefox 浏览器中不起作用 < ...

  2. DOM与元素节点内联样式

    获取.设置及移除单个内联 CSS 属性 每个 HTML 元素都有个 style 属性,可以用来插入针对该元素的内联 CSS 属性. <div style='background-color:bl ...

  3. CSS中的层叠、特殊性、继承、样式表中的@import

    CSS中的层叠.特殊性.继承.样式表中的@import 层叠 CSS有一个机制是层叠,层叠可以理解为对样式的覆盖,优先性为: 网站开发者的样式表 用户样式(通过设置浏览器的显示选项) 浏览器默认的样式 ...

  4. HTML&CSS基础-内联样式和内部样式表

    HTML&CSS基础-内联样式和内部样式表 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.CSS(Cascading Style Sheets)简介 层叠样式表(Cas ...

  5. 如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

    如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

  6. 你真的知道css三种存在样式(外联样式、内部样式、内联样式)的区别吗?

    css样式在html中有三种存在形态: 内联样式:<div style="display: none"></div> 内部样式: <style> ...

  7. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  8. JS获取内联样式

    JS获取内联样式 //获取内联样式 function getCss(obj,attr){//obj:对象,name:style属性 if(obj.currentStyle) { return obj. ...

  9. JavaScript 获取和修改 内联样式

    JavaScript 获取和修改 内联样式 版权声明:未经授权,严禁转载分享! 元素的样式 HTML 元素的 style 属性返回一个 CSSStyleDeclaration 类型的对象. Style ...

随机推荐

  1. [Javascript] Ternary Conditionals

    /** Ternary Conditionals */ // //**Bad** // var isArthur = false; var weapon; if(isArthur){ weapon = ...

  2. 怎样增加Dave 英语学习小组

    一.     增加小组 英语对IT 是非常重要的,但非常多人都不能坚持去学习,Dave 英语学习小组成立与已经超过半年,如今进行扩招.欢迎想提高英语,而且能够坚持每天学习的人,增加Dave 的小组.并 ...

  3. ArcGIS高程Z值的去除方法

    在ArcGIS中,我们常用的几何类型有点.线.面.体(体,在涉及三维的情况下使用),但在这之外,可能会遇到带ZM的类型,如图所示,面ZM,它与面类似,但比面多两个字段. 在编辑中查看草图属性可看到Z值 ...

  4. CentOS(学习笔记一)

    菜鸟记录 一.配置网络.防火墙等 setup命令 二.查看网络 ifconfig 重启网络 /ect/init.d/network restart 或者ifup ethx(,,)等 查看网络配置文件 ...

  5. #define中的“#”和“##”的作用

    在#define中,标准只定义了#和##两种操作: #用来把参数转换成字符串: ##则用来连接两个前后两个参数,把它们变成一个字符串.

  6. margin 负边距应用

    margin-right:负值,在没有设置DOM元素宽度的前提下,DOM元素宽度变宽. <!DOCTYPE html> <html lang="zh-CN"> ...

  7. SettingsNotePad++

      迁移时间:2017年5月20日11:04:46Author:Marydon官网下载 http://notepad-plus.en.softonic.com/1.修改字体大小及背景色 设置--> ...

  8. MYSQL在Win下免安装zip

    mysql对于Win测试简单zip安装即可了解my.in配置文件的妙处(show variables),本地搭建mysql服务测试引擎! 01.下载 https://dev.mysql.com/dow ...

  9. mybatis报错 Specified class is an interface

    本文转自:http://blog.csdn.net/u014331288/article/details/53869303 1.错误原因 Caused by: org.springframework. ...

  10. java 安装配置时出现的问题

    Error: could not open `C:\Program Files\Java\jre6\lib\i386\jvm.cfg') jdkerror  前些日子装了个jdk7试了试,后来做项目需 ...