CSS 指层叠样式表 (Cascading Style Sheets):

1 内联样式:无法复用,在元素style内写 ,很少使用;

2 内部样式:在head元素内style属性内写,此样式可以被当前页面中元素使用,小案例可以用一用;

3 外部样式:在单独CSS文件中写的样式,那个网页引用该文件就能复用该样式 ,一般使用这一种;

例子见下面代码:

CSSTest.html

<!-- CSSTest.html -->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title> <!-- 2 内部样式:在head元素内style属性内写,此样式可以被当前页面中元素使用 -->
<style>
/*style里是CSS,CSS的注释是这样写的*/
h1{color:yellow}
h2{color : blue} </style> <!-- 3 在单独CSS文件中写的样式,那个网页引用该文件就能复用该样式-->
<link rel = "stylesheet" href = "my.css"/> </head>
<body>
<!-- 1 内联样式:无法复用,在元素style内写 -->
<P style = "color:blue;">CSS</P>
<h1>CSS三种用法</h1>
<h2>内联样式</h2>
<h3>内部样式</h3>
<h4>外部样式</h4> </body>
</html>

my.css

/*my.css, 在单独CSS文件中写的样式,那个网页引用该文件就能复用该样式*/
h3{
color:gray
}
h4{
color:green
}

显示效果:

CSS三种样式的更多相关文章

  1. css三种样式表写法

    css三种样式表:1.内嵌样式表: <head>  <style type="text/css">   样式表写法  </style> < ...

  2. CSS三种样式表

    1.外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用 <link> 标签链接到样式表. & ...

  3. CSS选 择器 三种样式

    一.CSS三种样式 代码 宽度 高度 实线 颜色  A内联样式是优先级最高的方式 px必须写 A:内联式  弊端:代码多很乱 <body> <div class="divc ...

  4. CSS的三种样式:内联式,嵌入式,外部式以及他们的优先级

    从CSS 样式代码插入的形式来看基本能够分为下面3种:内联式.嵌入式和外部式三种. 1:内联式css样式表就是把css代码直接写在现有的HTML标签中,如以下代码: <p style=" ...

  5. 转载:CSS的组成,三种样式(内联式,嵌入式,外部式),优先级

    (仅供自己备份) 原文地址:http://blog.csdn.net/chq11106004389/article/details/50515717 CSS的组成 选择符/选择器+声明(属性+值) 选 ...

  6. CSS三种写法的优先级

    在HTML文件中引入CSS样式有三种方法: 外部样式:通过link标签引入CSS样式: 内页样式:写在HTML页面里面的style标签里面: 行内样式:写在对应标签的style属性里面. 我知道一般情 ...

  7. 设置css三种方法的优先级

    有的小伙伴问了,如果有一种情况:对于同一个元素我们同时用了三种方法设置css样式,那么哪种方法真正有效呢?在下面代码中就出现了这种情况 1.使用内联式CSS设置“超酷的互联网”文字为粉色. 2.然后使 ...

  8. 前端 CSS 三种引入方式

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

  9. HTML三种样式引入方式

    HTML三种样式引入方式   HTML有三种样式引入方式:行内样式(inline Styles).嵌入式样式表(Embedded Style Sheets).外部样式表(External Style ...

随机推荐

  1. JS第一部分--ECMAScript5.0标准语法 (JS基础语法)

    一,调试语句 二,JS的引入方式 三,变量的使用 四,基本的数据类型 4.1,基本数据类型转换 4.2,字符串的常用方法 五,复杂数据类型 5.1,Array(数组)及常用方法 六,流程控制( 逻辑与 ...

  2. audio

    // media.cpp : 定义控制台应用程序的入口点. // https://wenku.baidu.com/view/e910c474c5da50e2524d7fb4.html https:// ...

  3. gulp结合Thinkphp配置

    gulpfile.js文件 /*! * gulp * $ npm install gulp gulp-ruby-sass gulp-cached gulp-uglify gulp-rename gul ...

  4. Cordova入门系列(三)Cordova插件调用

    版权声明:本文为博主原创文章,转载请注明出处 上一章我们介绍了cordova android项目是如何运行的,这一章我们介绍cordova的核心内容,插件的调用.演示一个例子,通过cordova插件, ...

  5. koa-router 源码由浅入深的分析(7.4.0版本的)

    首先简单的介绍下什么koa-router,为什么要使用它,可以简单看下上一篇文章. 了解koa-router 首先我们来看下koa-router的源码的基本结构如下,它是由两部分组成的: ------ ...

  6. Vue-移动端项目真机测试

    一.查看ip地址 在控制台输入 ifconfig 查看ip地址 二.修改webpack-dev-server配置项 webpack-dev-server 默认不支持ip地址访问,需要修改配置项 三.测 ...

  7. 父进程结束,其子进程不会结束,会挂到init进程下

    结论:一个父进程产生子进程,父进程结束(kill),子进程不会结束,子进程被init进程托管 下面是过程: d.sh脚本是一个ping命令,执行d.sh 目前,103310 进程为父进程,103344 ...

  8. SqlServer2008_r2安装功能选择

    勾上数据引擎服务.客户端工具链接.sdk.管理工具.客户连接SDK.最后一个 sql2008安装时,怎么选择服务账户NT Authority\System ,系统内置账号,对本地系统拥有完全控制权限: ...

  9. 对List集合嵌套了map集合对double值进行排序

    /*[ { "repairo": "asda", "num": 88.71 }, { "repairo": " ...

  10. mybatis 使用auto mapping原理实现表间关联

    Auto mapping的示例 数据库中有一个person表,结构如下: mysql> desc person; +-------+-------------+------+-----+---- ...