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. canvas save()和canvas restore()状态的保存和恢复使用方法及实例

    canvas.save()用来保存先前状态的 canvas.restore()用来恢复之前保存的状态 注:两种方法必须搭配使用,否则没有效果 <!DOCTYPE html> <htm ...

  2. Ajax概述和判断用户名是否存在的简单代码练习

    在本代码中主要体现,Ajax实现了部分位置的刷新.不需要重新刷新网页,重新请求服务器.下面用过代码来对Ajax更深的认识 这里需要创建,一个jsp文件(显示登录界面),js文件(对Ajax的主要设置) ...

  3. 关键字-super

    super可以理解为是指向自己超(父)类对象的一个指针,而这个超类指的是离自己最近的一个父类. class BaseAction { String name; int age; void value( ...

  4. AQS框架源码分析-AbstractQueuedSynchronizer

    前言:AQS框架在J.U.C中的地位不言而喻,可以说没有AQS就没有J.U.C包,可见其重要性,因此有必要对其原理进行详细深入的理解. 1.AQS是什么 在深入AQS之前,首先我们要搞清楚什么是AQS ...

  5. Linux 进入 5.0 时代！

    Linux 进入 5.0 时代! 为什么 Linux 4.2 之后的版本不再是 4.21 而是 5.0? 如果你非要一个理由,那就是因为 Linux 4.x 的版本如今用手指与脚趾加在一起都要数不过来 ...

  6. spring MVC处理请求过程

    spring MVC处理请求过程 首先看一个整体图 简单说下各步骤: handlerMapping handlerMapping将请求映射到处理器,即图中的HandlerExecutionChain. ...

  7. EF Core 遇到“可能会导致循环或多重级联路径”

    在ef core中你可能会设计这样一个实体: public class Customer : Entity,IMustHaveTenant, IHasCreationTime { public Cus ...

  8. 21 python 初学（json pickle shelve）

    json: # _author: lily # _date: 2019/1/19 import json my_dict = {'name': 'lily', 'age': 18} f = open( ...

  9. leetcode 224. Basic Calculator 、227. Basic Calculator II

    这种题都要设置一个符号位的变量 224. Basic Calculator 设置数值和符号两个变量,遇到左括号将数值和符号加进栈中 class Solution { public: int calcu ...

  10. JRE与JDK简介

    如何进行 Java 开发: JRE: JDK: