CSS是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化。

详请:http://www.w3school.com.cn/h.asp

其存在方式有三种:元素内联、页面嵌入和引入外部CSS文件。

核心语法为:style="key1:value1;key2:value2"

1、元素内联:在标签中直接使用样式语法 style="key1:value1"

<body>
<div style="background-color: #0095bb">这是第二种方法</div>
</body>

2、页面嵌入:在页面中嵌入样式块 <style type="text/css"></style>块,样式块中间罗列样式,样式块一般放在head中

<head>
<meta charset="UTF-8">
<title>CSS</title>
<style type="text/css">
div{
background-color: #4cae4c;
}
</style>
</head>
<body>
<div>这是第二种方法</div>
</body>

问题:第一种及第二种方法同时存在了,怎么办?

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS</title>
<style type="text/css">
div{
background-color: green;
}
</style>
</head>
<body>
<div style="background-color: red">第一种方法为红色,第二种方法为绿色</div>
</body>
</html>

3、引入外部CSS文件

  1、创建外部CSS文件,其中直接写样式,如div标签

  

  2、将CSS文件引入到HTML中

  

<head>
<meta charset="UTF-8">
<title>CSS</title>
<link rel="stylesheet" type="text/css" href="ctest.css">
</head>
<body>
<div>这是第三种方法啦</div>
</body>

  3、检查样式产生的效果

  

css_三种引入方法的更多相关文章

  1. spring与mybatis三种整合方法

    spring与mybatis三种整合方法 本文主要介绍Spring与Mybatis三种常用整合方法,需要的整合架包是mybatis-spring.jar,可通过链接 http://code.googl ...

  2. struts2拦截器interceptor的三种配置方法

    1.struts2拦截器interceptor的三种配置方法 方法1. 普通配置法 <struts> <package name="struts2" extend ...

  3. RFID标签天线的三种制作方法

    在RFID标签中,天线层是主要的功能层,其目标是传输最大的能量进出标签芯片.RFID天线是按照射频识别所要求的功能而设计的电子线路,将导电银浆或导电碳浆网印在PVC.PC或PET上,再与面层.保护层和 ...

  4. 前端 CSS 三种引入方式

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

  5. 前端-CSS-介绍及三种引入方式

    我们为什么需要CSS? 使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在没有CSS之前,我们想要修改HTML元素的样式需要为每个HTML元素单独定义样式属性,当H ...

  6. K8S(02)管理核心资源的三种基本方法

    系列文章说明 本系列文章,可以基本算是 老男孩2019年王硕的K8S周末班课程 笔记,根据视频来看本笔记最好,否则有些地方会看不明白 需要视频可以联系我 管理k8s核心资源的三种基本方法: 目录 系列 ...

  7. javase-常用三种遍历方法

    javase-常用三种遍历方法 import java.util.ArrayList; import java.util.Iterator; import java.util.List; public ...

  8. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  9. Java中Map的三种遍历方法

    Map的三种遍历方法: 1. 使用keySet遍历,while循环: 2. 使用entrySet遍历,while循环: 3. 使用for循环遍历.   告诉您们一个小秘密: (下↓面是测试代码,最爱看 ...

随机推荐

  1. Qt中使用随机数

    新建Empty qmake project,命名为UseRand UseRand.pro SOURCES += \ main.cpp QT += core main.cpp #include < ...

  2. js实现图片预显示

    html页面代码 <div id="localImag" style="display:none"><img  id="previe ...

  3. Java 集合深入理解(14):Map 概述

    点击查看 Java 集合框架深入理解 系列, - ( ゜- ゜)つロ 乾杯~ 终于把 List 常用的几种容器介绍完了,接下来开始 Map 的相关介绍. 什么是 Map Java 中的 Map 接口 ...

  4. magento 去掉index.php .html

    首先应该确保你的服务器环境,达到了magento的运行需求,若你是使用的是magento专用空间就不必担心了,若不是请查看我以前的文章,检测你的运行环境(http://www.hellokeykey. ...

  5. 第一个Sprint冲刺第五天

    讨论成员:邵家文.李新.朱浩龙.陈俊金 讨论问题:掌握计时技术的知识 讨论地点:qq网络 进展:完成对功能的理解

  6. 【Bear】api分类

    参考 jQuery API 中文文档

  7. C语言Makefile文件使用

    C语言中代码Makefile文件的写法 单文件,例: #定义变量 CFLAGS=gcc #具体命令都需要一个入口,all: 这个就相当于入口,默认情况,执行第一次入口, #后面执行其他入口进行依赖,如 ...

  8. The implementation of Lua 5.0 阅读笔记(二)

    6 线程和协程 读完这篇文章我才意识到python的协程到底缺了什么,这个就是coroutine和semi-coroutine的区别了.区别就是,semi-coroutine只能返回(yield)到调 ...

  9. GO简易聊天系统后台源码分享

    本人是搞移动客户端开发的,业余时间接触到golang这么个可爱的囊地鼠,于是就写了这么个测试项目:简易版的聊天系统,功能包括注册,登陆,群聊和单聊,无需使用mysql,数据都存在了文本里.本人纯粹兴趣 ...

  10. postgresql存储二进制大数据文件

    如果想把整个文件或图片存储在数据表的一个字段内,该字段可以选择二进制类型,然后将文件按二进制存储起来,文本文件也可以存在text字段内. 示例如下: 二进制类型bytea的操作(在最大值内,有内存限制 ...